身份验证无效后重定向。史无前例

Redirect After Authentication Not Working. No Path in History

使用 Auth0 登录后重定向在我的 React 应用程序中不起作用。我遵循了 official tutorial.

中的代码

window.location.pathname 仅将“/”推送到历史记录,从而在刷新页面时将我的主页重定向到我的主页。

appState 道具在我的代码中似乎总是未定义。 Auth0 似乎没有给它赋值。我错过了什么吗?

有人以前在 React 或 Auth0 中遇到过这个问题吗?

import React from 'react';
import { useHistory } from 'react-router-dom';
import { Auth0Provider } from '@auth0/auth0-react';

const Auth0ProviderWithHistory = ({ children }) => {
    const history = useHistory();
    const domain = process.env.REACT_APP_AUTH0_DOMAIN;
    const clientId = process.env.REACT_APP_AUTH0_CLIENT_ID;
    const audience = process.env.REACT_APP_AUDIENCE;

  const onRedirectCallback = (appState) => {
    history.push(appState?.returnTo || window.location.pathname);
  };

  return (
    <Auth0Provider
      domain={domain}
      clientId={clientId}
      redirectUri={window.location.origin}
      onRedirectCallback={onRedirectCallback}
      audience={audience}
    >
      {children}
    </Auth0Provider>
  );
};

export default Auth0ProviderWithHistory;

我的路由结构

import React from 'react';
import { BrowserRouter, withRouter } from 'react-router-dom';
import { useAuth0 } from '@auth0/auth0-react';
import Auth0ProviderWithHistory from './Auth0ProviderWithHistory';

// Components
import Router from  './Router';
import { Navbar, Footer } from './components/';


const NavbarWithRouter = withRouter(Navbar);


export default function App() {
  return (
    <>
      <BrowserRouter>
        <Auth0ProviderWithHistory>
          <NavbarWithRouter />
          <Router />
          <Footer />
        </Auth0ProviderWithHistory>
      </BrowserRouter>
    </>
  );
}

我也遇到了同样的问题。在出现一些依赖性问题并更新 npm 包后,出现了这条奇怪的消息:

我在 auth0community 消息的帮助下解决了这个问题..https://community.auth0.com/t/redirecting-after-login/39821...提供:

const onRedirectCallback = appState => {
  history.push(
    appState && appState.targetUrl
      ? appState.targetUrl
      : window.location.href = "https://www.exampleroute.com/pointofredirect"
  );
};