Laravel Vue：表单提交时出现 Axios 401 错误答案

【问题标题】：Laravel Vue: Axios 401 error on form submitLaravel Vue：表单提交时出现 Axios 401 错误
【发布时间】：2019-09-03 11:10:20
【问题描述】：

我有一个可以创建/编辑用户的模式。但是当我点击提交按钮时，我收到了 401 错误。

方法如下：


sendUserData(){
                axios.post('/api/saveUser', {
                    headers: {
                        Authorization: 'Bearer ' + localStorage.getItem('token')
                    },
                    id: this.id,
                    name: this.name,
                    email: this.email,
                    password: this.password
                }).then(response => {
                    console.log(response.data);
                    this.$emit('userSaved')
                }).catch(error => {
                    console.log(error)
                });
            }

api.php 如下所示：


Route::group([

    'middleware' => 'api',
    'prefix' => 'auth'

], function ($router) {

    Route::post('login', 'AuthController@login');
    Route::post('logout', 'AuthController@logout');
    Route::post('refresh', 'AuthController@refresh');

});

Route::middleware('auth:api')->group(function () {
    Route::post('saveUser', 'UserController@saveUser');
});

如果我控制台记录令牌，我得到一个有效的 JSON 令牌

我该如何解决这个问题？

【问题讨论】：

您是否尝试使用 web.php 而不是 api.php ？也许这是解决您问题的第一步

标签： laravel vue.js vuejs2 axios

【解决方案1】：

您的 axios 函数格式不正确。应该是这样的：

axios.post('/api/saveUser', {
    id: this.id,
    name: this.name,
    email: this.email,
    password: this.password
}, {
  headers: {
    Authorization: 'Bearer ' + localStorage.getItem('token')
  },
}).then(response => {
    console.log(response.data);
    this.$emit('userSaved')
}).catch(error => {
    console.log(error)
});

【讨论】：