React Router:处理角色身份验证

时间:2016-10-05 20:41:32

标签: authentication reactjs oauth react-router acl

我正在开发一个具有多个角色的Web应用程序。我想到了一种方法,我可以使用React Router来限制某些路由上使用onEnter触发器的访问。

现在我想知道这是否是防止访问未授权页面的可靠方法。基本上,破解这个有多容易?它不应该太容易被黑客攻击,这就是全部。

请记住,在所有正在加载的资源上仍然存在服务器端身份验证,因此即使用户通过React Router突破,也不会返回任何未经授权的数据。

  <Route path="/" component={App}>
    <IndexRoute onEnter={authenticateUser} />
    <Route path="login" component={LoginPage} />
    <Route path={roles.ADMIN.homeRoute} component={Admin} onEnter={authenticateAdmin}>
      <IndexRoute component={DashboardPage} />
    </Route>
    <Route path={roles.OPERATIONS.homeRoute} component={Operations} onEnter={authenticateOperations}>
      <IndexRoute component={DashboardPage} />
    </Route>
  </Route>

目前,角色路由仅使用仪表板填充,但其思路是每个角色路由将包含多个子路由。通过这种配置,我希望我可以在输入受限制的角色路由时验证用户的角色,但是能够在子路由之间导航而无需在每次路由更改时进行身份验证。

1 个答案:

答案 0 :(得分:2)

这就像修改缓存角色的状态一样简单。只要您为每个资源都有服务器端身份验证,这不是问题。如果有的话,他们可能会看到组件的布局,但没有数据。