我已经成功地将Keycloak与ReactJS集成,但是当我刷新页面时,keycloak.authenticate返回false并再次要求凭据。
我已经在互联网上搜索了相关信息,建议在initOptions属性中传递令牌和刷新令牌,我已经这样做了,但仍然面临同样的问题。
我正在使用"@react-keycloak/web": "^2.1.1"和"keycloak-js": "^10.0.1"
以下是我的Keycloak.js代码:
import * as Keycloak from 'keycloak-js';
const keycloakConfig = {
url: 'https://smartgrid.doersops.com/auth/',
realm: 'OneSmartgrid',
clientId: 'smartgrid-react-web-admin',
}
const keycloak = new Keycloak(keycloakConfig);
export default keycloak
这是我的 App.js 代码:
import React from 'react';
import { KeycloakProvider } from '@react-keycloak/web'
import keycloak from './keycloak';
import { AppRouter } from './routes';
function App() {
const token = localStorage.getItem('token');
const refreshToken = localStorage.getItem('refreshToken');
const setTokens = (token, idToken, refreshToken) => {
localStorage.setItem('token', token);
localStorage.setItem('refreshToken', refreshToken);
localStorage.setItem('idToken', idToken);
}
return (
<KeycloakProvider
keycloak={keycloak}
onTokens={
(tokens: keycloakTokens) =>
setTokens(tokens.token ?? '', tokens.idToken ?? '', tokens.refreshToken ?? '')
}
initOptions={{ onLoad: 'login-required', token, refreshToken }}
>
<AppRouter />
</KeycloakProvider>
)
}
export default App;