为什么 csrf 令牌通常存储在隐藏的表单字段中？
Why are csrf token's usually stored in hidden form fields?
我正在开发 React 应用程序，并且正在考虑实施 CSRF 缓解技术。我决定使用 Same-Site cookie，但在此之前，我一直在研究使用 CSRF 令牌，并阅读了许多帖子说它们应该存储在隐藏的表单字段中。我想知道的是，将它存储在隐藏字段中和将其存储在 class 变量之类的东西中是否有区别？如果它的目的是在您准备好向服务器发送请求时保留在某个地方，那么它在客户端的存储方式是否重要？
如果您将它放在表单字段中，那么通常一切正常，但如果您将值放在其他任何地方，则您必须编写逻辑来提取该值并将其插入回发送到的表单数据中服务器。
使用表单字段也适用于 ajax 和标准表单提交，因此大多数教程将通过仅适用于其中一种的方法来推广它。
CSRF 令牌存储在隐藏输入中的原因是它会在提交表单时自动发送到服务器。如果您手动向服务器发送请求并自己获取数据，则可以将 CSRF 存储在任何地方。最好保持一致，将其存储在隐藏输入中。
其他答案是正确的，因为对于您在某处找到的教程（或 csrf 上的通用教程），使用在表单字段中写入的令牌更容易演示它，而且传统的 Web 应用程序也可以正常工作方式。
其他人没有提到的是现代 single-page 像 React 这样的应用程序不能那样工作，通常你甚至没有表单，并且将令牌写入表单字段是没有意义的。所以这些应用程序通常不会这样做。
这还有一个实际的方面。您提到将其存储在 class 变量中。这很好，但它如何到达那里呢？令牌通常（不一定，但现在是旁路）由 server-side 网络应用程序生成。 javascript SPA 将如何获得它？你需要把它写在页面的某处，花一个单独的请求来获取它会浪费资源。通常发生的一件事是将它写在页面顶部的元 header（例如 <meta name="csrf" content="...">）中，这样您的 SPA 就可以从那里读取它并将其存储在任何需要的地方。
另一件经常发生的事情是甚至不需要 csrf 保护，因为 api 身份验证是基于诸如请求 headers 之类的东西（而不是 cookie 中的东西），这不会是由浏览器自动发送，所以classic csrf不可行。
我正在开发 React 应用程序，并且正在考虑实施 CSRF 缓解技术。我决定使用 Same-Site cookie，但在此之前，我一直在研究使用 CSRF 令牌，并阅读了许多帖子说它们应该存储在隐藏的表单字段中。我想知道的是，将它存储在隐藏字段中和将其存储在 class 变量之类的东西中是否有区别？如果它的目的是在您准备好向服务器发送请求时保留在某个地方，那么它在客户端的存储方式是否重要？
如果您将它放在表单字段中，那么通常一切正常，但如果您将值放在其他任何地方，则您必须编写逻辑来提取该值并将其插入回发送到的表单数据中服务器。
使用表单字段也适用于 ajax 和标准表单提交，因此大多数教程将通过仅适用于其中一种的方法来推广它。
CSRF 令牌存储在隐藏输入中的原因是它会在提交表单时自动发送到服务器。如果您手动向服务器发送请求并自己获取数据，则可以将 CSRF 存储在任何地方。最好保持一致，将其存储在隐藏输入中。
其他答案是正确的，因为对于您在某处找到的教程（或 csrf 上的通用教程），使用在表单字段中写入的令牌更容易演示它，而且传统的 Web 应用程序也可以正常工作方式。
其他人没有提到的是现代 single-page 像 React 这样的应用程序不能那样工作，通常你甚至没有表单，并且将令牌写入表单字段是没有意义的。所以这些应用程序通常不会这样做。
这还有一个实际的方面。您提到将其存储在 class 变量中。这很好，但它如何到达那里呢？令牌通常（不一定，但现在是旁路）由 server-side 网络应用程序生成。 javascript SPA 将如何获得它？你需要把它写在页面的某处，花一个单独的请求来获取它会浪费资源。通常发生的一件事是将它写在页面顶部的元 header（例如 <meta name="csrf" content="...">）中，这样您的 SPA 就可以从那里读取它并将其存储在任何需要的地方。
另一件经常发生的事情是甚至不需要 csrf 保护，因为 api 身份验证是基于诸如请求 headers 之类的东西（而不是 cookie 中的东西），这不会是由浏览器自动发送，所以classic csrf不可行。