Laravel Passport

This section gives an example of how the NuxtAuthHandler can be configured to use Laravel Passport Oauth2 and SSO.

1. Creating an API client on Laravel Passport

You can refer to the official Laravel documentation to add new client to Passport.

By default, you can simply create one using the command:

php artisan passport:client

It will ask you to choose a

client ID, and
a redirect URI.

Keep the client ID for the next step and set the redirect URI to http://localhost:3000/api/auth/callback/laravelpassport (default value for dev environement, modify it according to your environement, you can add several URI comma separated).

2. Add a Laravel API route returning the user data

Next create a route that is returned to the user. In the example given here, we will use /api/v1/me.

The route will return the field of your user data. You must return a field with the key id.

3. Setting configuration and the provider

3.1. Storing the config in your .env

You can add the following variables to your .env:

PASSPORT_BASE_URL: the URL of your passport APP
PASSPORT_CLIENT_ID: the client ID you set in the previous step
PASSPORT_CLIENT_SECRET: the client secret Laravel generated for you at the end of step 1

# .envPASSPORT_BASE_URL=http://www.my_passport_app.testPASSPORT_CLIENT_ID=123456789PASSPORT_CLIENT_SECRET=123456789

3.2. Adding your config to the runtimeConfig

Then add these values to your runtimeConfig:

// ~/nuxt.config.tsexport default defineNuxtConfig({    //...    modules: [        //...        '@sidebase/nuxt-auth',    ],    runtimeConfig: {        //...        passport: {            baseUrl: process.env.PASSPORT_BASE_URL,            clientId: process.env.PASSPORT_CLIENT_ID,            clientSecret: process.env.PASSPORT_CLIENT_SECRET,        }            },});

2.3. Create the catch-all `NuxtAuthHandler` and add the this custom provider:

// ~/server/api/auth/[...].tsimport {NuxtAuthHandler} from '#auth'const {passport} = useRuntimeConfig(); //get the values from the runtimeConfigexport default NuxtAuthHandler({    //...    providers: [        {            id: "laravelpassport", //ID is only used for the callback URL            name: "Passport", // name is used for the login button            type: "oauth", // connexion type            version: "2.0",// oauth version            authorization: {                url: `${passport.baseUrl}/oauth/authorize`, // this is the route created by passport by default to get the autorization code                params: {                    scope: "*", // this is the wildcard for all scopes in laravel passport, you can specify scopes separated by a space                }            },            token: {                url: `${passport.baseUrl}/oauth/token`, // this is the default route created by passport to get and renew the tokens            },            clientId: passport.clientId, // the client Id            clientSecret: passport.clientSecret,// the client secret            userinfo: {                url: `${passport.baseUrl}/api/v1/me`,// this is a custom route that must return the current user that must be created in laravel            },            profile: (profile) => {                // map the session fields with you laravel fields                // profile is the user coming from the laravel app                // update the return with your own fields names                return {                    id: profile.id,                    name: profile.username,                    email: profile.email,                    image: profile.image,                };            },            idToken: false,        }    ],});