Question

不确定如何正确设置csrf_token。这是我的相关代码

物品-card.vue

<template>
.....
.....
    <input v-if="selected == 'name' + product.id" v-model="name" type="text" class="form-control" aria-describedby="basic-addon1" @blur.prevent="updateName">
    <form id="update-product-name" :action="'http://localhost:8000/updateProductName/'+product.id" method="POST" style="display: none;">
.....
.....
</template>
<script>
.....
.....
   methods:{
      updateName(){
        document.getElementById('update-product-name').submit();
      }
   }
.....
.....
</script>

app.blade.php

<head>
.....

    <!-- CSRF Token -->
    <meta id="token" name="csrf-token" content="{{ csrf_token() }}">
.....
</head>

app.js

Vue.http.headers.common['X-CSRF-TOKEN'] = $("#token").attr("value");

重新加载的页面显示：

VerifyCsrfToken.php第68行中的TokenMismatchException：

我做了一些研究，发现我不必在我提交的每个表单中添加csrf_token，只需要将它放在头元标记中。但它似乎不起作用。应该如何设置？

编辑＃1

我做了一些研究并将attr("value")更改为attr("content")，但同样的问题发生在我身上。

Answer 1

正如我在评论中提到的，你得到TokenMismatchException的原因是因为没有发送csrf标题。

Vue.http.headers.common [＆＃39; X-CSRF-TOKEN＆＃39;] = $（＆＃34; #tandle＆＃34;）。attr（＆＃34; content＆＃34;）;

以上将允许您在使用Vue-Resource时包含csrf标头。

您需要更改表单的行为，以便使用vue / vue-resource而不是默认的浏览器提交来提交。

这样做的一种方法是：

updateName() {

    let data = {
        //Add the data you want to be sent in the request here e.g.
        //name: this.name
    }

    this.$http.post('/updateProductName/' + this.product.id, data)
        .then(r => {
            //Do something on success
        })
        .catch(r => console.log(r))
}

希望这有帮助！

Vue 2 Laravel 5.3 POST方法提交时令牌不匹配

1 个答案: