ruby-on-rails - 如何保护客户端应用程序( react )和 API 通信

Question

我有一个客户端 React 应用程序和一个 Rails API，React 应用程序从中获取数据。

如您所料，我只希望我的 React 应用程序能够从 API 获取数据，而世界其他地方不应该能够从它接收数据。

尽管进行了大量搜索，我仍未找到保护两个应用程序之间通信安全的最佳方法。

我读过有关 JWT token 和基于 cookie 的 session 身份验证的内容，但大多数文章似乎都侧重于用户身份验证(即登录/注销)，而不仅仅是两个应用程序之间的通信。

这两个应用程序将共享同一个域，那么依靠 Cross Origin 来保护通信就足够了吗？

如果有任何建议，我们将不胜感激。

Answer 1

如果我答对了你的问题，你希望你的客户端(React App)成为唯一可以访问你的服务器的客户端。

作为解决方案，您必须结合使用 CORS 和 JWT 授权，因此我建议使用严格的 CORS 以仅允许您的 React 应用程序域调用服务器。为此，我通常使用 CORS npm 模块和 configure我服务器上的来源，或者你也可以自己做。

var express = require('express')
var cors = require('cors')
var app = express()

var corsOptions = {
  origin: 'http://example.com',
  optionsSuccessStatus: 200 // some legacy browsers (IE11, various SmartTVs) choke on 204 
}

上面的代码只允许来自 example.com 的请求被服务器接受或者看看 this code更动态的白名单和黑名单方法。

现在回到 JWT，它只是一个 json 加密和解密 token ，可以跨 API 请求共享以对用户进行身份验证和授权。

例如，您可以在 JWT 中存储用户的电子邮件、角色和昵称等信息，并在每个 API 请求中发送这个加密的 JWT，服务器授权此请求，如果为真则转发到请求的 API。这种授权和转发过程通常使用“拦截器”模式实现，其中中间件(Passport oAuth)在每次 API 调用之前进行检查和授权。

---

执行上述两件事将确保只有具有您允许与服务器通信的有效 JWT token 和域地址的客户端。这个客户端将成为您的 React 应用程序，因为它是唯一具有正确 JWT 和原始地址的应用程序。

所以现在您的 React 应用程序应该只确保在 API 调用(post/get/put)中传递适当的 JWT token ，很可能在 API 请求的 header 中，您可以有一个 API 帮助程序服务来执行此操作为您并将其导入到您进行 API 调用的组件中。并且您的 Node 服务器将实现通行证中间件模式来授权此 JWT 并过滤未授权的请求。

如果您的 React 应用程序没有登录名，JWT 也可以是客户端 ID，它将您的客户端识别为合法。就像用户登录一样，你可以让你的应用程序使用 secret 客户端 ID 等数据调用服务器。这将返回一个 JWT token 。或者，您可以预先生成一个 JWT token ，并在它第一次加载时 react 应用程序存储它，并通过设置 TTL 和另一个配置，您可以检查正在调用您的服务器的客户端是旧的还是新的或其他一些假客户。

HTH