Consume Passport fror Ajax calls : Laravel

Question

I am using Passport within my Laravel-5.7 based application. It is first time for me to work on any Laravel application using Passport. I am able to generate oauth_access_token successfully. However, integrating Passport in my application breaks running ajax calls. I tried to find solution on Internet but I am missing some point.

Whenever, I make a ajax request I get this result {"message":"Unauthenticated."}

Since, this route is supposed to be used in admin panel, it consumes a protected route. Here, is my Javascript code for ajax call:

jQuery(function ($) {
    startTime();
    $('button[name="controller"], button[name="generateApi"]').on('click', function () {
        var url = "";
        var button = $(this);
        var data = {api_token: "{!! $user->api_token !!}"};

        if (button.hasClass('tre')) {
            url = "{{ route('abc') }}";
        } else {
            url = "{{ route('xyz') }}";
            data.dataId = button.data('id');
        }

        var x = document.cookie;
        $.ajax({
            url: url,
            headers: {
                    "X-CSRF-TOKEN" : '{{ csrf_token() }}',
                    "Authorization": "Bearer " + "{{ Cookie::get('laravel_token') }}",
            },
            type: 'post',
            dataType: 'json',
            data: data,
        }).done(function (res) {

            if (button.hasClass('tre')) {
                $('input[name="apiKey"]').val(res.apiKey);
                return true;
            }

            $(button).toggleClass('btn-success btn-danger');
        });
    });
});

API route declaration:

Route::post('functionCall', ['middleware' => 'auth:api', 'uses' => 'XYZ@functionCall', 'as' => 'xyz']);

Please, help me sort out what I am missing in this code.

Answer 1

If you're consuming your own API with Javascript, you need to add the middleware Laravel\Passport\Http\Middleware\CreateFreshApiToken::class to your route. See docs: https://laravel.com/docs/5.6/passport#consuming-your-api-with-javascript.