Laravel Vue: Axios 401 error on form submit

Question

I have a modal where I can create/edit user. But when I click on the submit button I got a 401 error.

The method looks like this:


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)
                });
            }

The api.php looks like this:


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');
});

If I console.log the token I got a valid JSON token

How can I fix this?

Did you try to use web.php instead of api.php ? Maybe it's the first step to solve your issue — eightball
– eightball, Commented Sep 3, 2019 at 13:11

Luca Rossi · Accepted Answer · 2019-09-03 16:08:22Z

3

Your axios function is not well formatted. It should be like this:

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)
});

answered Sep 3, 2019 at 16:08

Luca Rossi

7761 gold badge6 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Laravel Vue: Axios 401 error on form submit

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related