关于 CSRF 的具体作用简单讲一下实现。

后端会生成一个 token，通过 cookie 发送给前端，

前端发送请求时，需要把这个 token 通过以下两种方式之一传递给后端：

* 通过 Form POST 的方式，在 form data 中携带;
* 通过 Header 的方式，header 名为：X-CSRFToken;

后端会检查 cookie 中的 token 跟上述两种方式之一提供的 token 是否一致。

如果用 js 发请求，可以从 cookie 中读取 csrftoken，然后添加到 X-CSRFToken 这个 header 中，具体方法见：(axios 封装了这个功能，因此只需要配置就行)

export function RequestManager () {
  this.app = null

  this.axios = axios.create({
    baseURL: '',
    xsrfCookieName: 'csrftoken',
    xsrfHeaderName: 'X-CSRFToken',
    validateStatus: function (status) {
      // 默认情况下，所有请求都走 then()，因此代码中只需要写 then，不需要写 catch。
      // 一些特殊情况会在 interceptors 中进行全局处理，全局处理时会 reject
      return true
    },
  })
}

如果用传统的 Form 方式，则 Django 模板中这样写：
<form>
　　{% csrf_token %}
　　<button type="submit"></button>
</form>

其中，{% csrf_token %} 会被渲染成 <input type="hidden" name="csrftoken" value="xxx" />

具体见 Django 文档：https://docs.djangoproject.com/en/3.1/ref/csrf/#how-to-use-it

 

参考文件：

axios 源码参考