Laravel 和 Vue：尝试使用 axios 存储数据

Question

用户流程是这样的：

我正在尝试使用 Axios 在路径 /api/car/store 上将数据保存到 laravel 后端控制器中，但是在发出请求时收到 401 HTTP 错误。 p>

我认为是 Header 部分...

我假设我在使用axios.post 发出请求时没有正确的标头数据。

VUE组件法

saveCarDetails(){
    let config = {
        'Content-Type': 'application/json',
    }
    let currentObj = this;
    axios.post('/api/car/store', {
        user_id: currentObj.auth_user.id,
        car: currentObj.car
    }, config)
        .then(function (response) {
            console.log(response.data);
        })
        .catch(function (error) {
            currentObj = error;
        })
        .then(() => {
            this.errors.clear();
        })
}

Bootstrap.js

window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

控制台错误 enter image description here

Answer 1

我认为您需要更改 RouteServiceProvider 中的中间件以使用 web 而不是 api。