如何使用rails API管理react应用程序中的安全性？

Question

我一整天都在寻找答案，但我找不到任何有帮助的东西。

我目前正在使用React和Rails API开发的平台。 My Rails API使用devise-token来处理安全性和身份验证（https://github.com/lynndylanhurley/devise_token_auth）。 我没有使用React-Redux。

React前端有公共页面（例如登录）和私有页面，需要登录（有效的访问令牌）。

我将访问令牌，uid和客户端存储在会话存储中（这3个参数来自登录响应），并且每个请求的头部都会发送访问令牌。

这就是我的想法：

1. 用户登录后，将响应存储在会话存储中，也存储在javascript对象中。除非用户刷新页面，否则该对象将存在，或者关闭并重新打开它。
2. 每次用户导航到私有页面时，在路由器返回组件之前，我将检查我的LoggedInUser javascript对象是否有某些内容。如果它没有任何东西，我会调用＆＃34; validate_token＆＃34;具有会话存储内容的端点，因为这意味着它是返回用户。如果它有效，请将其保存在名为＆＃34; LoggedInUser＆＃34;的javascript对象中。如果不是，请重定向到登录页面。
3. 如果我的LoggedInUser对象或会话存储中没有任何内容，我将重定向到登录名。

我的问题是：

1. 如果我们总是在谈论javascript变量和ajax调用（客户端），我怎样才能使我的私人页面安全？未经授权的用户可以调试我的javascript文件，在＆＃34; LoggedInUser＆＃34;中创建内容。对象，并看到我的私人页面。此人无法看到任何内容，因为所有带有无效令牌的请求都会返回401，但他们仍然可以看到我的HTML或静态文件以及现有的API请求。 / LI>

   非常感谢！

Answer 1

  

如何使我的私人网页安全

如果你的pkg全部捆绑在一起，你就不能。但是，您可以提供模板，并仅为授权用户从服务器加载数据。

另一种选择：

在服务器上托管您的私人应用，并仅将其提供给允许的用户。 Webpack允许您在需要时加载特定模块（延迟加载）。我相信，通过这种技术，您可以防止为未经授权的用户提供某些模块。

但逻辑必须在服务器端完成：

https://webpack.js.org/guides/lazy-load-react/