Javascript 在react中执行基于角色的路由时，使用switch语句并根据角色显示不同的组件是否是一个安全问题？

我有下面的代码，它很简单，可以完成这项工作。但这有安全问题吗？这是我第一次做基于角色的授权，所以我试图了解我可以做得更好

导出默认常量RootPage（{role}）=>{
交换机（角色）{
案例用户：返回
案例管理员：返回
默认值：返回
}
}

有几个选项可供选择，所有选项都（几乎）与其他选项一样（不）安全。它是javascript，如果有人想要，那么可以将其更改为客户端

您可以在进行切换时进行切换，或执行类似操作：

{role==="admin" && <AdminStuff />} // the component only gets rendered if the first part is true
{role==="user"  && <UserStuff />}  // so in this case it's one or the other.

{role===“admin”&&&}//仅当第一部分为true时，才会呈现组件
{role===“user”&&}//因此在本例中，它是一个或另一个。

您还可以创建一个称为投票者的组件：

function RoleVoter({grantedRole, requiredRole, children){
    render(){
        return grantedRole===requiredRole ? children : null;
    }
}
// Example:
<RoleVoter grantedRole={role} requiredRole={ADMIN}> <AdminStuff/> </RoleVoter>

函数RoleVoter（{grantedRole，requiredRole，children）{
render（）{
return grantedRole==requiredRole？子级：空；
}
}
//例如：

每种方法的复杂性和可用性各不相同，它们都有各自的优点/缺点。如果“只有一种情况可以匹配”，则切换是有用的.The

&&

方法适用于快速编码，但会导致硬编码速度非常快，难以维护。RoleVoter aproach更复杂，可能有些过火，但现在您可以将每个角色都放在其中。并将其扩展以了解多个角色（如管理员和查看订单，如果您需要这种级别的安全性）

---

所有这些都和另一个一样安全。这是Javascript，在客户端，你对此无能为力。更重要的是，你选择了一个开发人员易于实现/理解的解决方案。原因是安全性越容易实现，你实现它的频率就越高

那么真正的安全性在哪里？简单：服务器端。想象一下，你破解了一些javascript，让它显示一个管理页面，但服务器从未给它实际的内容。非常无用。你还根据当前用户创建了服务器端的安全检查

一种标准的方法是让投票者（小函数）分别测试两件事：

• 用户是否可以添加/查看/编辑/删除此类项目（通常）？例如，用户在尝试编辑用户时是否具有编辑用户权限？或者在尝试查看订单时是否具有查看订单权限
• 用户是否可以添加/查看/编辑/删除此特定项目？例如，如果您只能更改您自己的订单，那么该订单实际上是您的吗

---

它总是加载主页吗？。你从哪里得到

{role}

value@sarvonks很抱歉，这将作为路由组件中的道具传入。您是否正在使用

react router dom

？@Vencovsky yes i ami如果

角色

值存储在类似浏览器的本地存储中，用户可能会编辑其本地存储以将其角色设置为

管理员

，并将其重定向到管理页面。理想情况下，每次导航到页面时，您都会进行某种服务器端检查以检查授权。我应该提到我打算进行服务器端检查并将其传递到前端。因此，在dynamodb中，我们将保留与每个用户关联的用户和角色列表。然后，当用户需要访问管理页面时例如，我会点击dynamodb来检查经过身份验证的用户的角色，然后将其返回到前端。在那里，我会使用类似rolevoter的东西来显示相应的组件。这有意义吗？前端做什么其实并不重要。只要没有安全的数据进入前端，就不会有什么不好的事情发生高级视图：如果用户登录时我所做的只是查询dynamodb以查看哪个角色属于用户，然后将其传递回——在本例中，假设角色名为“admin”——角色返回前端为“admin”，然后roleVoter拿起它并显示相应的管理页面。前端javascript不能仍然更改吗？角色投票者仍然根据传入的道具确定要呈现的组件，而不管道具是来自服务器端还是客户端（如初始示例所示）。或者我混淆了这一点吗？是的，有人可以更改它。Y你“只要”打开浏览器控制台，摆弄一下，看看会发生什么。但我永远不能改变我的服务器端角色。我可以将我的javascript值从“user”改为“admin”，但这并不意味着我会在服务器端。因此，有人可能会看到管理页面，但由于服务器从不提供内容，所以页面是空的。你应该改变你的逻辑：用户可以看到所有页面、所有路由、所有脚本、客户端的所有内容。管理页面也是如此。但是，服务器从不提供实际内容，而且我们都是善良的人，所以我们会隐藏这些内容从用户处删除空的管理员页面。