vue 发送 post 请求到 django 返回403： CSRF Failed: CSRF token missing or incorrect

问题描述

前端 vue, 后端 django 。前端在发送post到后端时返回 403：CSRF Failed: CSRF token missing or incorrect

原因

django，会对合法的跨域访问做这样的检验，cookies里面存储的’csrftoken’，和post的header里面的字段”X-CSRFToken’作比较，只有两者匹配，才能通过跨域检验。否则会返回这个错误:CSRF Failed: CSRF token missing or incorrect

解决方法

在post 请求头中添加 X-CSRFToken ，这个值可以在 cookie 中获得
如下：

function getCookie (name) {
      var value = '; ' + document.cookie
      var parts = value.split('; ' + name + '=')
      if (parts.length === 2) return parts.pop().split(';').shift()
    }

export const register = parmas => { return axios.post(`${host}/users/`, parmas,{headers:{'X-CSRFToken': getCookie("csrftoken")}}) }