Question

我目前有一个经过身份验证的受保护路由组件，它可以在检查用户是否登录时正常工作。通过这些身份验证路由登录后，如果存在 profileId，我需要有其他受保护的路由。基本上，我的应用程序中有一些路由受 auth 保护，一些路由受 profileId 和 auth 保护。 profileId 保护的路由也必须受到身份验证保护。如何才能做到这一点？这些是我用于身份验证的受保护路由：

const withMasterLayout = Component => ({ ...props }) => (
  <MasterLayout>
    <Component {...props} />
  </MasterLayout>
);

const ProtectedRoute = ({ component: Component, ...args }) => {
  const { isAuthenticated, loginWithRedirect } = useAuth0();

  return (
    <Route
      render={props => (isAuthenticated ? withMasterLayout(Component)(props) : loginWithRedirect())}
      {...args}
    />
  );
};

我的 MasterLayout 组件基本上是我的应用程序，带有导航栏、布局等...

如果您需要更多信息，请告诉我

这是路由的使用方式：

<Route exact path={ROUTES.login} component={Login} /> // the login route
<ProtectedRoute exact path={ROUTES.dashboard} component={Dashboard} /> // the protected route once logged in 
// I'll need another protected route that checks if logged in and if profileId doesnt equal to null. Else redirect to <Home />

反应路由器保护路由双重身份验证

0 个答案: