Laravel API Authentication using Passport results in 401 (Unauthorized)

2
votes

Following the documentation on Laravel regarding Passport authentication for the API route, i'm currently having some problems when using axois to fetch data from the api.

So far I have installed Passport through Composer, added the hasApiTokens trait, added a call to Passport::routes within the boot method of AuthServiceProvider and set the driver option of api authentication guard to 'passport'.

Since I would like the user to consume the API through Javascript from a Vue based SPA after login, I have added CreateFreshApiToken to the web middleware group.

The problem occurs when I run the following snippet to test everything out:

axios.get('api/users').then( function(response) { console.log(response.data); });

The result is a 'Failed to load resource: the server responded with a status of 401 (Unauthorized)' response.

I have checked the headers from the request sent with axois and the headers contain both

Cookie:laravel_token=eyJpdiI6ImJ5RG1KRk....

and

X-XSRF-TOKEN:eyJpdiI6IlVRRHhxSXp2VDVy...

Am i doing anything wrong?

5
phplaravelapiauthenticationlaravel-passport
I have the same error but the answer below doesn't fix it... - mesqueeb
Did you try the fix from github.com/laravel/passport/issues/47#issuecomment-242808444 ? - palan
This fixed the issue for me: github.com/laravel/passport/issues/795#issuecomment-411708604 - Luis Dalmolin

5 Answers

3
votes

Try adding the auth middleware to the api group of your Kernel.php

    'api' => [
        'throttle:60,1',
        'bindings',
        'auth:api',
    ],

https://github.com/jeremykenedy/laravel-passport/blob/master/app/Http/Kernel.php

1
votes

The CreateFreshApiToken must be in the last line.

'web' => [
    // Other middleware...
    \Laravel\Passport\Http\Middleware\CreateFreshApiToken::class,
],
0
votes

I was able to resolve this error that dozens or hundreds of people report online, but none of the existing solutions worked for me, except for the following.
using Laravel 5.8, following docs to set up Passport.

In my case, although I was including the csrf token in a meta tag, it was not being picked up as the Passport documentation states that laravel will by default. from the docs (https://laravel.com/docs/5.8/passport#consuming-your-api-with-javascript):

" the default Laravel JavaScript scaffolding instructs Axios to always send the X-CSRF-TOKEN and X-Requested-With headers. "

and then the example is provided:

// In your application layout...
<meta name="csrf-token" content="{{ csrf_token() }}">

// Laravel's JavaScript scaffolding...
window.axios.defaults.headers.common = {
    'X-Requested-With': 'XMLHttpRequest',
};

Well that would be great if it worked that way by default as the docs state, but in my case I had to explicitly set the axios default to include the contents of said csrf-token meta tag before making the axios request. like this:

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

In my case, this was the only thing that allowed me to get past the 401 unauthorized error, which seems to indicate either:
A) something in my project's configuration has altered the default behavior of axios requests by not setting them automatically include the csrf-token based on the meta tag if present or
B) the docs are inaccurate on this one point, and in the present version of Laravel and Passport that is not the default behavior as stated.

0
votes

I tried the below code. Paste below code in .htaccess file in your project root folder.

RewriteEngine On
RewriteCond %{HTTP:Authorization} ^(.*)
RewriteRule .* - [e=HTTP_AUTHORIZATION:%1]
-7
votes

Try this command, it's work for me like a charm.

php artisan config:cache