how to integrate passport-facebook and jwt without session? - jwt

Question

I want to use passport-github or facebook login with jwt token, without using saving sessions on the server.
But we have two requests from 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('/');
});
how to handle the frontend codes?
In normal case, we only have one request
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)
});
}
so we can save the token locally. but for passport-facebook, we have two requests('/auth/facebook' and '/auth/facebook/callback'). So how to save the token locally?

Answer 1

First of all, I think the GET request will not work. You need to use an a link to trigger the /auth/login.
<a href="http://localhost:5150/auth/facebook">
To send the token to the client, you should redirect to a client page with the jwt stored in cookie.
const token = user.generateJwt();
res.cookie("auth", token);
return res.redirect(`http://localhost:3000/socialauthredirect`);
and at the client landing page extract the jwt and save it to local storage.
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 />;
}
}