React 前端和 Node 后端的安全性



我对现代JavaScript Web开发世界相对较新。我已经构建了一个非常简单的 Node/Express 后端和一个单独的 React 前端。我的模糊计划是让用户有权访问前端的某些区域,然后让前端向后端发出请求。前端和后端是否可以共享相同的身份验证/授权方案?他们都可以使用 Auth0 之类的东西吗?如何确保这两个安全?

我有点卡住了,希望得到任何建议或朝着正确方向的推动。我主要是被困住了,因为这是两个独立的应用程序,但同一个"用户"在技术上有权访问某些 React 视图以及某些 Express 端点 - 它们如何一起哞哞?

谢谢。

虽然似乎与您的主题没有直接关系,但如果您不打算立即开始处理大型项目(不要对可扩展性施加太大压力(,我实际上建议您尝试 Meteor。

Meteor内置了对Accounts的支持,并与MongoDB很好地交互,并且它还具有自己的DDP协议,可以大大简化API调用。它也与 React 很好地交互。

如果你认为Meteor可能不是一个好的选择,你仍然可以从它的授权等设计政策中学习。它有相当多的包源代码,不太难理解,应该有助于你学习基本思想。(其实 Meteor 的 Accounts 包已经实现了另一位回答者提到的基本思路,你可以从它的设计原理中学习(

当用户登录到您的站点时,向他们颁发他们保留客户端的访问令牌。在前端,在渲染组件之前检查用户是否具有令牌和正确的权限。在后端,将令牌作为请求标头发送到终结点。

我已经实现了类似的情况,但后端使用了 spring boot kotlin。我的解决方案是使用 JWT 令牌来验证身份验证和授权。

  1. 用户通过输入登录表单登录,并通过 REST API 将 POST 方法发送到后端。后端验证凭据并返回 JWT 令牌,包括加密user_role、到期日期等...如果有效或403 exception

  2. 前端解码 JWT(使用 jwt-decode lib 或其他东西(,保存它以验证对特定页面的访问权限基于user_role的网站。例如:角色='ADMIN'可以访问管理仪表板页面,角色='USER'可以访问用户个人资料页面等。

如果你使用 express 作为后端,我建议使用 feathersjs。它具有为此提供的后端解决方案和可选的前端版本。参考: https://docs.feathersjs.com/api/authentication/jwt.html

安全前端 (React.js( 和后端 (Node.js/Express Rest API( 与 Keycloak 遵循这个

最新更新