我正在使用Azure使用身份验证设置混合应用程序,我通过身份验证成功,并且能够发送回重定向URL'capacitor:// localhost / callback'。一旦我重定向到重定向URI,App就会显示空白屏幕,并且没有任何内容呈现或正常工作(React-router,react.js)。
Index.tsx
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import App from './App';
import registerServiceWorker from './serviceWorker';
import { HashRouter} from 'react-router-dom';
import {Plugins} from '@capacitor/core'
import ionCapContext from '@auth/ionicCapacitor'
const { SplashScreen } = Plugins
const renderApp = function (){
const rootDiv = document.getElementById('root') as HTMLElement;
ReactDOM.render(
<HashRouter>
<App />
</HashRouter>
, rootDiv);
registerServiceWorker();
}
if (window.cordova) {
document.addEventListener("deviceready", () => {
SplashScreen.hide();
ionCapContext.AuthContext().then(d=>{
renderApp()
}).catch(e=>console.log(e))
}, false)
}
else {
renderApp()
}
ionicCapacitor.ts
import {registerWebPlugin} from "@capacitor/core";
import {OAuth2Client,OAuth2AuthenticateOptions} from '@byteowls/capacitor-oauth2';
import {
Plugins
} from '@capacitor/core';
export const authOptions:OAuth2AuthenticateOptions = {
appId:'<APPID>', authorizationBaseUrl:'https://login.microsoftonline.com/organizations/oauth2/v2.0/authorize',
accessTokenEndpoint:'capacitor://localhost/#/AuthCallback',
scope:'user.read',
responseType:'token',
state:<State Token>,
web:{
redirectUrl:window.location.origin
},
ios:{
customScheme:'capacitor://localhost/#/AuthCallback'
}
}
class capacitorAuth {
constructor(){
registerWebPlugin(OAuth2Client);
}
async AuthContext(){
const respo = await Plugins.OAuth2Client.authenticate(authOptions)
return respo;
}
}
const ionCapContext = new capacitorAuth();
export default ionCapContext;