reactjs 依赖于认证验证的组件的安全客户端侧条件呈现

hfwmuf9z  于 2022-12-18  发布在  React
关注(0)|答案(2)|浏览(98)

利用浏览器的devtools重新加载编辑过的javascript覆盖的能力,你如何“安全地”执行依赖于验证的前端代码呢?
假设你想根据授权用户的权限有条件地显示某种专有的UI元素(幽默我),授权用户的数据将通过承诺进行验证,但是如果条件是基于返回的承诺数据的客户端,难道不能删除该条件,保存为覆盖并重新加载页面吗?

if (permissionGroup == 'Team'){
  return <>{children}</>
}

if (nodeENV !== 'development'){
  checkAuth();
}

编辑并运行JS覆盖以返回子项,而不运行身份验证检查

if (permissionGroup !== 'anything'){
  return <>{children}</>
}

有什么方法可以防止这种情况吗?我对devtools安全性的了解是错误的吗?或者行业标准是否理解为,除了数据,任何客户端都是开源的?

anauzrmj

anauzrmj1#

您永远不会信任客户端,正如您提到的,客户端可以修改代码并覆盖您的“安全特性”。
您将需要一个后端,并需要验证客户端的输入。

rn0zuynd

rn0zuynd2#

答案是,除了使用可能的某种加密服务(如JSscrambler)之外,根本不可能在前端安全地控制动态呈现的组件
解决方案是,仅将组件呈现给客户端,呈现给被授权访问或查看组件的用户,该用户已经在服务器上被认证、验证和授权。

相关问题