找到路由器（用于 Relay Modern）受保护的身份验证路由

Posted 2023-03-08

【中文标题】找到路由器（用于 Relay Modern）受保护的身份验证路由

【英文标题】：Found Router (for Relay Modern) Protected auth route

【发布时间】：2018-07-21 09:33:00

【问题描述】：

我正在尝试创建一个受保护的路由，当用户未被授权使用 Found Router for Relay Modern 根据 React Router 给出的示例时，该路由将重定向到 /login：

const PrivateRoute = ( component: Component, ...rest ) => 
  return (<Route ...rest render=props => 
    if (!props) return
    if (Component && props && props.viewer) 
      return (<Component ...props />)
     else 
      throw new RedirectException('/login')
    
  
  />)

我用真实的登录逻辑替换了 fakeAuth，但其余的都是一样的。 Route 只是不渲染。

Found Router 似乎对围绕这个特定问题的示例很了解。有什么想法吗？

【参考方案1】：

我最终将我的登录和经过身份验证的路由分开：

export default makeRouteConfig(
  <Route>
    <LoginRoute exact path='/login' Component=Login query=LoginQuery />
    <PrivateRoute path='/' Component=App query=AppQuery>
  </Route>
)

并像这样为LoginRoute 扩展路由：

export class LoginRoute extends Route 
  render( Component, props ) 
    if (!props) return undefined
    if (Component && props && props.viewer) 
      throw new RedirectException('/')
    
    return (<Component ...props />)
  

PrivateRoute 看起来很相似，但在没有查看器的情况下重定向不同。

效果很好。

该项目的创建者 Jimmy Jia 提出了一些我最终没有使用但可能对任何未来读者有用的建议。请参阅我的已关闭问题here。