如何在VUE或reqwest中添加CSRF令牌?

时间:2018-04-12 05:58:10

标签: django vue.js csrf reqwest

当我向服务器发送数据时,即使这样做,服务器也没有响应 如果request.method ==' POST':     打印(" ************请求正文*******")

在django views.py中。这些代码无法运作。

enter code here

var app6 = new Vue({
  el: '#app-6',
  data: {
     realtimecost:0,
  },
  created() {            
        setInterval(() =>
        {
             this.realtimecost=this.realtimecost+1;           
             if(this.realtimecost==5)
                this.sendData();// here 

          }, 1000);
  },
  methods: {  
    sendData:function ()//send data
     {
        var self = this;
        reqwest({
        url:'http://127.0.0.1:8000/tasks/',
        method:'post', 
        type:'json',
        headers: {
         "X-CSRFToken": Cookies.get('csrftoken')
            },
        data:
        {
              realtimecost:5,
        },//end data
         success:function(resp){

         //self.getData()
         }//end success
        })//end reqwest
        },//end senddata

  }//end method

})//end app6

1 个答案:

答案 0 :(得分:0)

也许我在网络表单中使用{%csrf_token%},因此&#34; X-CSRFToken&#34;:Cookies.get(&#39; csrftoken&#39;)无法正常工作。< / p>

最后我放置&#34; X-CSRFToken&#34;:&#39; {{csrf_token}}&#39;在标题中,它的工作原理。但我不知道它的机制。

reqwest({
        url:'http://127.0.0.1:8000/tasks/',
        method:'post', 
        type:'json',
        headers: {
         "X-CSRFToken":'{{ csrf_token }}'
            },