这能成为保卫csrf的战略吗？(双提交曲奇)

Question

使用的框架: nuxt.js + spring (Api)

1. 调用一次性api生成随机值，并在第一次访问页面时设置httpOnly cookie(例如key=csrfToken)。
2. api响应也存储在vuex中。(响应还具有令牌体。带有设置-Cookie头。)
3. 当请求使用axios时，如果存在"csrfToken“cookie，则向请求中添加自定义标头(例如key=CSRF_TOKEN_HEADER)。
4. 在服务器中，如果交付了csrfToken cookie，请查找自定义标头值，以比较它们是否相同。

我知道$store本身并不安全。但是，我认为CSRF是可以防御的，因为$store是无法从外部站点访问的。

如果我有什么问题，请告诉我。

Answer 1

当请求使用axios时，如果存在"csrfToken“cookie，则向请求中添加自定义标头(例如key=CSRF_TOKEN_HEADER)。

因为cookie是httpOnly，所以您将无法判断是否存在。

CSRF攻击是通过欺骗用户提出他们不打算提出的请求来工作的。

传统的方法是在攻击网站上设置一个表单，将action发送到被攻击的网站。当提交该表单时，请求来自用户的浏览器，并包含目标网站的所有用户cookie。

对此的辩护是要求请求包括攻击地点无法知道的信息。CSRF令牌。

由于攻击站点无法从用户的cookie或站点的会话存储(取决于存储的位置)或其他任何地方读取该令牌，因此它们不能将其包含在表单数据中。

但是您没有使用常规的表单提交。您正在使用JavaScript来发出请求。

这是一个内置的防御：同一原产地政策和飞行前请求。

您所需要做的就是强制预先处理请求(例如，通过将Content-Type请求头设置为application/json并在正文中包含一个JSON有效负载)。

这将迫使来自攻击站点的请求发出飞行前请求。您的服务器不会让攻击者白名单。因此，浏览器永远不会发出攻击请求。

如果攻击者试图发出非预置的请求，它将没有JSON有效负载，因此您的服务器可以以格式错误为由拒绝它。