[Vuejs]-CSRF token mismatch in Laravel and Vuejs

0👍

Well it may be caused by the first 2 lines in your code:

import Axios from 'axios'
window.axios = require('axios');

You should choose one way of importing axios and go with that

Have a look at this solution:

window.axios = require('axios');
Vue.prototype.$http = window.axios

window.axios.defaults.headers.common = {
    'X-Requested-With': 'XMLHttpRequest',
    'X-CSRF-TOKEN' : document.querySelector('meta[name="csrf-token"]').getAttribute('content')
};

Now we know for sure that Vue.prototype.$http (which is window.axios) will also send the CSRF headers you set.

-1👍

You can give headers like ajaxSetup

this.$http.post('store', { email: this.email}, 
{ 
   headers: {
     'Content-Type': 'application/json', 
     'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
   } 
}

Leave a comment