2017-02-04 2 views
0

Не знаете, как настроить csrf_token должным образом. вот мои коды, связанные сVue 2 Laravel 5.3 Метод отправки отправляется с несоответствием токенов

Item-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"); 

Reloaded страницу и показывает:

TokenMismatchException в VerifyCsrfToken.php линии 68:

Я сделал некоторые исследования и обнаружил, что я не должен добавить csrf_token в каждой форме я представить и просто нужно поместить его в голову мета-тег. Однако это не работает. Как его настроить?

EDIT # 1

Я сделал несколько исследований, и изменил attr("value") в attr("content") но та же проблема происходит со мной.

+0

@Saurabh help please – warmjaijai

+0

Вы не используете 'Vue.http' для отправки формы, чтобы он не включал заголовок. –

+0

благодарит за ваш отзыв @RossWilson! так что бы вы предложили мне вместо этого подать заявку? – warmjaijai

ответ

1

Как я уже упоминал в комментариях, причина, по которой вы получали TokenMismatchException, состояла в том, что заголовок csrf не отправлялся.

Vue.http.headers.common ['X-CSRF-TOKEN'] = $ ("# токен"). Attr ("content");

Вышеупомянутое позволит вам включить заголовок csrf при использовании Vue-Resource.

Вам нужно будет изменить поведение вашей формы, чтобы оно было отправлено с помощью 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)) 
} 

Надеется, что это помогает!

+0

это очень помогает мне! спасибо за помощь – warmjaijai

Смежные вопросы