history.replace不能使用Auth0从'history / createBrowserHistory'开始工作

时间:2018-03-27 17:09:38

标签: reactjs browser-history auth0

我正在尝试在我的应用程序中使用history.replace('/user')重定向用户,但是当我这样做时,它什么也没做。我正在使用Auth0并遵循他们的指南: https://auth0.com/docs/quickstart/spa/react/01-login

当我在登录后重定向时,它在网址中显示/user但没有任何反应,我在callback组件上堆叠。甚至如果我点击logout应该重定向到用户组件,它也不会有效。它只是在浏览器中显示/user,实际上并没有将它们带到页面。

import auth0 from 'auth0-js';
import createHistory from 'history/createBrowserHistory';
const history = createHistory();

export default class Auth {
  constructor() {
    this.login = this.login.bind(this);
    this.logout = this.logout.bind(this);
    this.handleAuth = this.handleAuth.bind(this);
    this.isAuth = this.isAuth.bind(this);
  }

  auth0 = new auth0.WebAuth({
    domain: 'taustin.auth0.com',
    clientID: 'IL1cmtElngJNYF3Ncjpt3pCRA5NFIDZw',
    redirectUri: 'http://localhost:3000/callback',
    audience: 'https://taustin.auth0.com/userinfo',
    responseType: 'token id_token',
    scope: 'openid'
  });

  handleAuth() {
    this.auth0.parseHash((err, authResult) => {
      if (authResult && authResult.accessToken && authResult.idToken) {
        this.setSession(authResult);
        // redirect user to home page
        history.replace('/user');
      } else if (err) {
        // redirect user to home page with error
        history.replace('/user');
      }
    });
  }

  setSession(authResult) {
    // Set how long the access token will last
    let expiresAt = JSON.stringify(
      authResult.expiresIn * 1000 + new Date().getTime()
    );
    localStorage.setItem('access_token', authResult.accessToken);
    localStorage.setItem('id_token', authResult.idToken);
    localStorage.setItem('expires_at', expiresAt);
    // redirect user to home page or desired page
    history.replace('/user');
  }

  logout() {
    // Clear Access Token and ID Token from local storage
    localStorage.removeItem('access_token');
    localStorage.removeItem('id_token');
    localStorage.removeItem('expires_at');
    // navigate to the home route
    history.replace('/user');
  }

  isAuth() {
    // Check whether the current time is past the
    // Access Token's expiry time
    // If not expires at exist should automatically return false
    let expiresAt = JSON.parse(localStorage.getItem('expires_at'));
    return new Date().getTime() < expiresAt;
  }

  login() {
    this.auth0.authorize();
  }
}

1 个答案:

答案 0 :(得分:1)

我认为这可以解决你的问题。

import * as firebase from "firebase/app"
import 'firebase/firestore'
import 'firebase/functions'