Nuxt js utilisant le passeport laravel redirige vers la page de connexion après l'actualisation de la page sur les pages sécurisées
J'utilise le passeport laravel pour mon authentification NUXT. Je suis ce doc:
https://auth.nuxtjs.org/providers/laravel-passport.html#usage
Je peux me connecter avec succès sur mon nuxt-app. Il redirige vers le tableau de bord après la connexion dans lequel le tableau de bord a middleware:'auth'
. Le problème est. lorsque j'actualise le tableau de bord, il redirige vers la page de connexion. Sur la console js, $auth.isAuthenticated
renvoie true, mais sur SSR, c'est false. Je suppose que le problème est là middleware:auth
, je ne suis pas sûr. J'ai déjà cherché sur google mais il n'y a pas de solution. J'ai déjà essayé ceci:
https://github.com/nuxt-community/auth-module/issues/478
Mon code ressemble à ceci ci-dessous:
Implémentation de l'authentification Laravel 7 Passport avec l'interface Nuxt
Quelqu'un connaît-il la solution?
Réponses
Le http_only
cookie n'est pas disponible avec SSR. Vous devrez donc créer un plugin nuxt. Et là, vous devriez vérifier si le access_token
n'existe pas et user
existe dans les cookies (lorsque l'utilisateur se connecte, vous devez créer un cookie avec les informations de l'utilisateur ou l'identifiant de l'utilisateur, personnellement, j'utiliserais Vuex combiné avec vuex-persistedstate ). Et si l'utilisateur existe dans les cookies et access_token
n'existe pas, vous devez actualiser le jeton.
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');
});
}
});
}
Pour plus d'informations, lisez cet article
J'ai été confronté à ce problème tout récemment, bien que cette réponse puisse ne pas être utile à l'op, je pense qu'elle peut être utile à d'autres dans le futur.
C'est ce que nous avons fait ci-dessous, sous vos routes api qui peuvent être trouvées dans routes / api.php, ajoutez le domaine nuxt js accédant à l'api de l'application laravel, utilisez le code ci-dessous - assurez-vous de formater spécifiquement pour votre propre cas d'utilisation
$landingRoutes = function () { //your routes }; Route::group(['domain' => config('app.DASHBOARD_DOMAIN1')], $landingRoutes);
Route::group(['domain' => config('app._DASHBOARD_DOMAIN2')], $landingRoutes);
J'ai aussi écrit à ce sujet sur mon blog ici