2017-08-18 1 views
1

Hallo Ich habe eine Komponente reagieren, die eine Form wie das macht:Umleiten auf den Weg vom Node.JS Server übertragen nicht die nächste Seite

<form onSubmit={this.onSubmit}> 
    <!-- a bunch of inputs here --> 
</form> 

, wo die Funktion onSubmit() einen Beitrag Anfrage /results macht axios mit :

handleSubmit(e) { 
    var self = this; 
    e.preventDefault(); 
    const {value1, value 2, ....} = this.state; 
    axios.post('/results', { 
     key1 : value1, 
     key2 : value2, 
     etc. 
    }).then(function(response) { 
     if (errors) { 
      self.setState({errors: response.data.errorMessage}); 
     } 
    }).catch(function(error){ 
     console.log(error); 
    }); 
    } 

habe ich einen Route-Handler in meinem server.js für die Post-Anforderung, die die Daten aus dem Formular in eine Datenbank einfügt. Wenn es Fehler gibt, sendet es diese Daten zurück an den Client, andernfalls sollte es auf die Ergebnisseite umgeleitet werden. Der Handler sieht wie folgt aus:

app.post('/results', function(req, res, next) { 
    const reportExists = Report.findOne({ 
    attributes: ['caseId'], 
    where: {caseId : req.body.caseId}, 
    }).then(report => { 
    if (report) { 
     console.log("report already exists"); 
     res.status(200).send({errorMessage : "Report has been submitted for this case id"}); 
    } else { 
     const report = Report.create(
     { 
      // data from form 
     } 
    ).then(() => { 
     console.log('Record inserted successfully'); 
     var caseId = req.body.caseId; 
     res.redirect("/results/" + caseId); 
     next(); 
     }) 
     .catch(err => { 
     console.log('failed to insert record'); 
     res.status(200).send({errorMessage: "Failed to insert record"}); 
     }); 
    } 
    }); 
}); 

Ich habe eine andere app.get('/results/:caseId') Handler, die die geeignete Route für die Ergebnisseite machen sollte. Wenn der Datensatz jedoch erfolgreich eingefügt wird und nicht auf diese Seite umgeleitet wird, verbleibt er auf derselben Seite wie das Formular. Meine Frage ist, sollte ich vom Client oder vom Server auf diese Seite umleiten?

+0

Rufen Sie 'next()' nach 'res.redirect()' nicht auf. – jfriend00

Antwort

1

Senden eines Ajax-Aufrufs über clientseitige JavaScript ruft nur die Antwort vom Server zurück, was auch immer es ist. Eine Weiterleitung wird nicht automatisch vom Browser verarbeitet, es ist nur die Ajax-Antwort auf Ihr Javascript. Es hängt von Ihrem clientseitigen JavaScript ab, was Sie mit der Weiterleitungsantwort tun.

Sie haben ein paar Möglichkeiten. Sie können die Umleitungsantwort in Ihrem clientseitigen JavaScript erkennen und dann window.location mit dem neuen Standort festlegen und den Browser manuell anweisen, auf die neue Seite zu wechseln. Oder Sie können den Browser lieber das Formular als Ihr clientseitiges Javascript senden lassen und dann folgt der Browser automatisch der Weiterleitungsantwort.


Außerdem sollten Sie nicht next() aufrufen, nachdem Sie res.redirect() nennen. Nachdem Sie die Antwort gesendet haben, sollten Sie die Ausführung anderer Routen-Handler nicht zulassen.

Verwandte Themen