comment intégrer passport-facebook et jwt sans session?

Question

Je souhaite utiliser passport-github ou facebook login avec jeton jwt, sans utiliser les sessions de sauvegarde sur le serveur. Mais nous avons deux demandes de frontend:

app.get('/auth/facebook', 
    passport.authenticate('facebook')); 

app.get('/auth/facebook/callback', 
    passport.authenticate('facebook', { failureRedirect: '/login' }), 
    function(req, res) { 
    // Successful authentication, redirect home. 
    res.redirect('/'); 
    }); 

comment gérer les codes frontend?

Dans le cas normal, nous avons une seule demande

axios.post(`${API_URL}/auth/login`, { email, password }) 
.then(response => { 
    cookie.save('token', response.data.token, { path: '/' }); 
    dispatch({ type: AUTH_USER }); 
    window.location.href = CLIENT_ROOT_URL + '/dashboard'; 
}) 
.catch((error) => { 
    errorHandler(dispatch, error.response, AUTH_ERROR) 
}); 
} 

afin que nous puissions sauver le jeton sur place. mais pour le passeport-facebook, nous avons deux requêtes ('/ auth/facebook' et '/ auth/facebook/callback'). Alors, comment sauvegarder le jeton localement?

Answer 1

Tout d'abord, je pense que la requête GET ne fonctionnera pas. Vous devez utiliser un lien pour déclencher le/auth/login.

<a href="http://localhost:5150/auth/facebook"> 

Pour envoyer le jeton au client, vous devez rediriger vers une page de client avec le JWT stocké dans cookie.

const token = user.generateJwt(); 
res.cookie("auth", token); 
return res.redirect(`http://localhost:3000/socialauthredirect`); 

et à la page de destination client extraire le JWT et enregistrez-le stockage local.

class SocialAuthRedirect extends Component { 
    componentWillMount() { 
    this.props.dispatch(
     fbAuthUser(getCookie("auth"),() => { 
     document.cookie = 
      "auth=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; 
     this.props.history.push("/profile"); 
     }) 
    ); 
    } 

    render() { 
    return <div />; 
    } 
}