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'。