javascript - SPA 中刷新 token Cookie 的 CSRF 保护

Question

我在 AngularJS SPA 中使用资源所有者密码凭证 OAuth 2.0 流程。有几篇文章(here，here ..)和this question的答案。这解释了我们不应该在(网络)客户端(LocalStorage)上存储刷新 token ，而是将它们加密存储在 HttpOnly Cookie 中并使用代理 API，我们在其中实现刷新 token 的解密以将其转发到安全 token 服务。

大多数文章都暗示我们应该通过使用一种常见的保护机制来关注 CSRF。我想知道单页应用程序中的最佳解决方案是什么。

Angular $http引用解释了我们应该如何应对 CSRF 的默认机制:服务器必须设置一个名为 XSRF-TOKEN 的 cookie。此 cookie 必须是 Javascript 可读的，以便我们可以在我们的请求中设置 X-XSRF-TOKEN HTTP header 。这种机制是否足以保护刷新 token 场景？

1. 第一次启动应用程序。没有可用的访问 token 或 cookie，我们必须使用用户名和密码登录。 api/login 为我们提供了一个访问 token ，我们将其保存在内存中并设置两个 cookie。 HttpOnly 刷新 token cookie 和 JS 可读 XSRF-TOKEN cookie。

2. 访问 token 过期。调用 api/token 验证 XSRF-TOKEN 并使用 token cookie 返回新的访问 token ；设置一个新的刷新 cookie

3. 从 AppCache 重新启动应用程序。内存中没有访问 token ，但 cookie 可用。使用api/token...

4. 坏人想偷我们的刷新 cookies 。准备好的页面使用我们的 cookie 向 api/token 发出请求，但没有 X-XSRF-TOKEN HTTP header 。

有任何严重的安全问题吗？

Answer 1

据我所知，执行此操作的最佳方法是当服务器呈现 index.html 并在其中包含 CSFR token 时，然后您将作为标准 AngularJS SPA 运行。因此 index.html 然后使用后端服务/框架生成的 CSFR token 进行充实。 SpringSecurity 为将 token 注入(inject)模板提供了很好的支持。

之后，您可以使用 javascript 从模板中获取 token ，并使用 httpInterceptor 将其设置为 header 中的所有 $http 请求，请求 Hook 。 (或 cookies )？我不记得正确的方法是什么，但我确信它在你上面提到的文章中有描述)