vue-element-admin 模板 登錄頁面 post請求通過django的csrf認證，處理304錯誤

經過一天的研究，終於把 vue-admin-template 模板的 post 請求 和django的api 弄通了 沒有了那該死的304報錯了

直接貼代碼：

在main.js中 我直接給設置了一個 csrf_token 全局變量來接收 csrf 認證的token

　　window.csrf_token ='' //聲明csrf_token 的全局變量

然后在 api 接口中設置 post方法的 

headers 請求頭

headers: { 'Content-Type': 'multipart/form-data', 'X-CSRFToken': csrf_token},

export function login(data) {
  return request({
    url: '/api/user/login/',
    method: 'post',
    headers: { 'Content-Type': 'multipart/form-data', 'X-CSRFToken': csrf_token},
    params:{'username':data.username,'password':data.password}
  })
}

api接口獲取csrf_token的接口方法

import request from '@/utils/request'


export function get_csrf() {
  return request({
    url: '/api/get_csrf',
    method: 'get',
  })
}

在系統加載登錄頁面時 先想后台發送get請求來獲取 csrf_token 中的token

methods:{
   get_token(){
      get_csrf().then(res => {
        // console.log(res.token)
        csrf_token = res.token  //將得到的token 賦值給全局變量
      })
    }
  },
  created(){
    this.get_token() //獲取csrf_token
    this.get_user() //獲取用戶列表
  }

這前台頁面都設置好了

后台views中  創建 get_csrf 的接口 用來動態獲取token

from django.middleware.csrf import get_token

# csrf認證
def get_csrf(request):
    # 生成 csrf 數據，發送給前端
    csrf_token = get_token(request)
    return JsonResponse({'token':csrf_token,'code':200})

這樣前台的 所有post的請求 就可以通過csrf認證了