Accessing Token Based API Route via Vue/Axios

Posted 4 months ago by nickdavies07

I would like to use the basic token API authentication in Laravel; no real need to set up Laravel Passport just for this request.

I have an API route set up to fetch the user's school i.e.

routes/api.php

Route::middleware('auth:api')->get('/user/school', function (Request $request) {
    return $request->user()->school;
});

I have a Vue component set up with an axios request to get the user's school, passing the token as a prop to the component then accessing through axios' params.

Vue Component

axios.get('/api/user/school', {
    params: {
        'api_token': this.token,
    }
}).then(response => (this.school = response.data))

What would be the best method for passing the api_token to the Vue component to access this data?

Should I just add it as a prop to the component in the blade file and pass it through that way as I have been? i.e.

Blade File

<user-school token={{ auth()->user()->api_token }}></user-school>

Please sign in or create an account to participate in this conversation.