Passport.js - Senden Sie Daten zurück, um die App zu reagieren, während Sie nach dem Login umleiten

Question

Ich erstelle eine React/Redux App und bin neu beim Einrichten des Backends mit Node/Express und Authentifizierung mit Passport. Was ich möchte, ist, dass der Benutzer sich anmeldet, die Zugangsdaten überprüft werden und wenn der Benutzer von der Datenbank gefunden wird, leite den Benutzer zur nächsten Seite um und gebe die Benutzerinformation zurück, so dass ich den Reduzierer aktualisieren kann.

Mein Endpunkt für die Anmeldung funktioniert so, wie ich denke, da ich auf req.user Objekt zugreifen kann und die richtigen Benutzerinformationen nach erfolgreicher Authentifizierung zurückbekomme. Wo ich feststecke, umadressiert den Benutzer zu einer anderen Seite, während ich auch die Information dieses Benutzers weiterleite, also kann ich redox Speicher aktualisieren.

EDIT: So aktualisierte ich Antwort durch Senden von Benutzerinformationen nach der Authentifizierung sowie die nächste Route, um den Benutzer umzuleiten. Da ich Redux verwende, führe ich eine Login-Aktion aus, und wenn ich eine Antwort bekomme, leite ich den Benutzer mit window.location um. Das löst teilweise mein Problem, obwohl ich nach der Anmeldung weiterleite, glaube ich, dass nach der Aktualisierung von window.location mein redux-Speicher aktualisiert wird und ich alle Informationen verliere, die ich auf der Serverseite gepackt habe.

app.post('/api/login', passport.authenticate('local-login', { failureRedirect: '/login'}), (req, res) => { 
    res.json({ 
    redirect: '/profile 
    userInfo: req.user.dataValues}) 
    }) 
}) 

export const login = (email, password) => { 
    return(dispatch) => { 
    axios 
    .post('/api/login', { 
     email: email, 
     password: password 
    }) 
    .then(resp => { 
     dispatch({ 
     type: 'LOGIN_USER', 
     data: resp.data 
     }) 
     window.location = resp.data.redirect 
    }) 
    .catch(errors => { 
     console.log(erros) 
    }) 
    } 
} 

Answer 1

Sie verlieren Ihren Zustand, weil Sie eine Seite neu geladen mit window.location = resp.data.redirect zwingen. Sie sollten einen Router mit Ihrer Anwendung verwenden, um die URL-Änderungen vorzunehmen (z. B. react-router-dom). Sie können die URLs programmgesteuert ändern, indem Sie pushState (oder vielleicht hashRouting?) Verwenden, anstatt die Art, wie Sie derzeit sind, umzuleiten.