React keycloak TypeError: kc.updateToken(...).success is not a function
React keycloak TypeError: kc.updateToken(...).success is not a function
我正在使用 keycloak 实现。
这是我的密钥斗篷初始化配置:
const token = localStorage.getItem('kc_token');
const refreshToken = localStorage.getItem('kc_refreshToken');
export const keycloakInitConfig = {
onLoad: 'login-required',
promiseType: 'native',
token,
refreshToken,
};
有时我会遇到这个错误
TypeError: kc.updateToken(...).success is not a function
如果有人能帮助我,非常感谢。
更新 1:
kc.updateToken(-1).success(function() {
kc.onAuthSuccess && kc.onAuthSuccess();
initPromise.setSuccess();
}).error(function() {
kc.onAuthError && kc.onAuthError();
if (initOptions.onLoad) {
onLoad();
} else {
initPromise.setError();
}
});
我在 node_modules
中有这个,我的 keycloak-js
版本是 6.0.0
。
更新 2:
export const keycloakInitConfig = {
onLoad: 'login-required',
promiseType: 'native',
token,
refreshToken,
};
export const onKeycloakEvent = (store) => (event, error) => {
console.log('event?????', event);
if (event === 'onAuthSuccess') {
keycloak.loadUserProfile()
.then((userInfo) => {
store.dispatch({
type: actionTypes.SET_USER_INFO,
payload: { user: userInfo },
});
})
.catch((err) => {
console.log('loadUserProfile: ', err);
localStorage.removeItem('kc_token');
localStorage.removeItem('kc_idToken');
localStorage.removeItem('kc_refreshToken');
store.dispatch({
type: actionTypes.LOG_OUT,
});
keycloak.logout();
});
} else if (error) {
console.log('onKeycloakEvent', event, error);
}
};
export const onKeycloakTokens = (tokens) => {
localStorage.setItem('kc_token', tokens.token);
localStorage.setItem('kc_idToken', tokens.idToken);
localStorage.setItem('kc_refreshToken', tokens.refreshToken);
};
和KeycloakProvider
ReactDOM.render(
<KeycloakProvider
keycloak={keycloak}
initConfig={keycloakInitConfig}
onEvent={onKeycloakEvent(store)}
onTokens={onKeycloakTokens}
>
...
</KeycloakProvider>,
document.getElementById('root'),
);
您正在使用 "old" .success()
方法,但您已在初始化配置中使用本机承诺类型 (promiseType: 'native'
) 进行配置。
使用标准 Promise
类型的标准 .then()
方法,就像我这里的示例一样,它应该可以工作:https://github.com/dasniko/keycloak-reactjs-demo/blob/master/src/index.js#L48-L49
这是 keycloak-js 本身的问题,它将与 keycloak-js 的 8.0.0 版本一起发布。
此外,react-keycloak 并未在内部使用 .success()。
有关此问题的更多详细信息,请参阅此处。
KEYCLOAK-8938
我建议您避免在设置中使用 promiseType: 'native'。
我正在使用 keycloak 实现。
这是我的密钥斗篷初始化配置:
const token = localStorage.getItem('kc_token');
const refreshToken = localStorage.getItem('kc_refreshToken');
export const keycloakInitConfig = {
onLoad: 'login-required',
promiseType: 'native',
token,
refreshToken,
};
有时我会遇到这个错误
TypeError: kc.updateToken(...).success is not a function
如果有人能帮助我,非常感谢。
更新 1:
kc.updateToken(-1).success(function() {
kc.onAuthSuccess && kc.onAuthSuccess();
initPromise.setSuccess();
}).error(function() {
kc.onAuthError && kc.onAuthError();
if (initOptions.onLoad) {
onLoad();
} else {
initPromise.setError();
}
});
我在 node_modules
中有这个,我的 keycloak-js
版本是 6.0.0
。
更新 2:
export const keycloakInitConfig = {
onLoad: 'login-required',
promiseType: 'native',
token,
refreshToken,
};
export const onKeycloakEvent = (store) => (event, error) => {
console.log('event?????', event);
if (event === 'onAuthSuccess') {
keycloak.loadUserProfile()
.then((userInfo) => {
store.dispatch({
type: actionTypes.SET_USER_INFO,
payload: { user: userInfo },
});
})
.catch((err) => {
console.log('loadUserProfile: ', err);
localStorage.removeItem('kc_token');
localStorage.removeItem('kc_idToken');
localStorage.removeItem('kc_refreshToken');
store.dispatch({
type: actionTypes.LOG_OUT,
});
keycloak.logout();
});
} else if (error) {
console.log('onKeycloakEvent', event, error);
}
};
export const onKeycloakTokens = (tokens) => {
localStorage.setItem('kc_token', tokens.token);
localStorage.setItem('kc_idToken', tokens.idToken);
localStorage.setItem('kc_refreshToken', tokens.refreshToken);
};
和KeycloakProvider
ReactDOM.render(
<KeycloakProvider
keycloak={keycloak}
initConfig={keycloakInitConfig}
onEvent={onKeycloakEvent(store)}
onTokens={onKeycloakTokens}
>
...
</KeycloakProvider>,
document.getElementById('root'),
);
您正在使用 "old" .success()
方法,但您已在初始化配置中使用本机承诺类型 (promiseType: 'native'
) 进行配置。
使用标准 Promise
类型的标准 .then()
方法,就像我这里的示例一样,它应该可以工作:https://github.com/dasniko/keycloak-reactjs-demo/blob/master/src/index.js#L48-L49
这是 keycloak-js 本身的问题,它将与 keycloak-js 的 8.0.0 版本一起发布。
此外,react-keycloak 并未在内部使用 .success()。
有关此问题的更多详细信息,请参阅此处。 KEYCLOAK-8938
我建议您避免在设置中使用 promiseType: 'native'。