Nuxt js che utilizza il passaporto laravel reindirizza alla pagina di accesso dopo l'aggiornamento della pagina sulle pagine protette
Sto usando il passaporto Laravel per la mia autenticazione NUXT. Sto seguendo questo documento:
https://auth.nuxtjs.org/providers/laravel-passport.html#usage
Posso accedere con successo alla mia app nuxt. Reindirizza alla dashboard dopo il login in cui ha dashboard middleware:'auth'
. Il problema è. quando aggiorno la dashboard, reindirizza alla pagina di accesso. Sulla console js, $auth.isAuthenticated
restituisce true, ma su SSR è false. Immagino che il problema sia acceso middleware:auth
, non ne sono sicuro. Ho già cercato su google ma non c'è soluzione. L'ho già provato:
https://github.com/nuxt-community/auth-module/issues/478
Il mio codice è simile al seguente:
Implementazione dell'autenticazione di Laravel 7 Passport con il frontend Nuxt
Qualcuno conosce la soluzione?
Risposte
Il http_only
cookie non è disponibile con SSR. Quindi dovrai creare un plugin nuxt. E lì dovresti controllare se access_token
non esiste ed user
esiste nei cookie (quando l'utente accede, dovresti creare un cookie con informazioni utente o ID utente, personalmente userei Vuex combinato con vuex-persistedstate ). E se l'utente esiste nei cookie e access_token
non esiste, è necessario aggiornare il token.
plugins/refresh-token.js
import clientCookies from 'js-cookie';
/**
* For refreshing the token on page reload.
*
* @param {Object} context.store
* @return {Void}
*/
export default function ({store}) {
window.onNuxtReady(() => {
let token = clientCookies.get('x-access-token');
let user = store.getters['user/currentUser'];
if (user && ! token) {
store.dispatch('auth/refreshToken')
.catch(errors => {
store.dispatch('auth/signUserOut');
});
}
});
}
Per ulteriori informazioni, leggi questo post
Ho affrontato questo problema solo di recente, anche se questa risposta potrebbe non essere utile per l'operazione, credo che potrebbe essere utile ad altri in futuro.
Questo è quello che abbiamo fatto di seguito, sotto le tue rotte API che possono essere trovate in rotte / api.php, aggiungi il dominio nuxt js accedendo all'API dell'applicazione laravel, usa il codice qui sotto - assicurati di formattare specificamente per il tuo caso d'uso
$landingRoutes = function () { //your routes }; Route::group(['domain' => config('app.DASHBOARD_DOMAIN1')], $landingRoutes);
Route::group(['domain' => config('app._DASHBOARD_DOMAIN2')], $landingRoutes);
Ne ho scritto anche sul mio blog qui