it-swarm.com.de

Umleitung mit "pure" Node.js aus einer Callback-Funktion

Das Folgende ist ein MCVE meines server.js-Codes:

let fs = require('fs');
let http = require('http');

http.createServer((req, res) => {
    // Handles GET requests
    if(req.method == 'GET') {
        let file = req.url == '/' ? './index.html': '/login.html'; // just an example
        fs.readFile(file, (err, data) => {
            res.writeHead(200, {'Content-Type': 'text/html'});
            res.end(data);
        });
    } 

    // Handles POST requests
    else {
        read(status => {
            if(status) {
                res.writeHead(302, {
                    'Location': 'http://localhost:8000/login.html',
                    'Content-Type': 'text/html'
                });
                res.end();
                console.log('Redirected!');
            }
        });
    }
}).listen(8000);

// In my actual script, the `read` function reads JSON files and sends data,
// so I've used the callback function
let read = callback => fs.readFile( './index.html', (err, data) => callback(true) );

Und ich habe zwei HTML-Dateien, wie im Code erwähnt.

index.html

<input type="submit" onclick='let xhr = new XMLHttpRequest(); xhr.open("POST", "http://localhost:8000"); xhr.send();'>

Ich habe Inline-Skript verwendet, um den Verkehr in meinem MCVE zu minimieren. Zu Entwicklungszwecken verwende ich externe Skripts auf meiner Website

login.html

<h1>Login</h1>

Wenn ich nun http://localhost öffne, wird index.html schön angezeigt. Wie Sie bemerkt haben, ist index.html nur eine Schaltfläche. Wenn ich also auf diese Schaltfläche klicke, wird die Ajax-Anforderung erfolgreich ausgelöst und alles funktioniert einwandfrei (keine Konsolenfehler), mit Ausnahme der Tatsache, dass die Seite [ nicht umleitet. Ich weiß nicht, was falsch läuft oder was sonst noch fehlt.

Ich bin ein Anfänger in Node.js und lese über die Umleitung in Nodejs - URL umleiten und Wie kann ich die Browser-URL des Benutzers auf eine andere Seite in Nodejs umleiten? , ich habe viel gesucht, konnte aber keinen Hinweis darauf bekommen. Vielen Dank für Ihre Zeit!

Ich bin mir auch bewusst, was Express bedeutet, aber ich denke nicht an die Verwendung von Frameworks, da sie Kernkonzepte verbergen.


EDIT: Wenn ich versuche, das Callback-Konzept umzuleiten, funktioniert es einwandfrei, wie dieses Video uns sagt.

11
rv7

Dies ist kein Problem mit node.js. Es ist genau so, wie sich Browser verhalten.

Ajax (XHR) löst keine Umleitungen im Browser aus. Wenn Browser XHR-Browserentwickler implementierten, ging man davon aus, dass Sie das Seitenaktualisierungsverhalten steuern möchten. Daher wurde sichergestellt, dass XHR keine Standardaktion auslöst. Alle Weiterleitungen werden stummgeschaltet, und die daraus resultierenden Daten der Weiterleitung werden an den onreadystatechange-Rückruf Ihres XHR-Objekts übergeben.

Wenn Sie Weiterleitungen zum Auslösen der Seitenaktualisierung verwenden möchten, können Sie einfach XHR nicht verwenden. Machen Sie stattdessen eine Formularübergabe:

<!-- index.html -->
<form action="http://localhost:8000" method="post">
    <input type="submit">
</form>

Wenn Sie stattdessen AJAX verwenden möchten, müssen Sie die Weiterleitung im Browser wie oben erwähnt ausführen:

// server.js

// ...

http.createServer((req, res) => {

    // ...

    // Handles POST requests
    else {
        read(status => {
            if(status) {
                res.writeHead(200, {'Content-Type': 'application/json'});
                res.end(JSON.stringify({
                    your_response: 'here'
                }));
            }
        });
    }
}).listen(8000);

Dann handhaben Sie diese Antwort im Browser:

index.html

<input type="submit" onclick='let xhr = new XMLHttpRequest();xhr.addEventListener("load", function(){var response = JSON.parse(this.responseText);/* check response if you need it: */if (response.your_response === 'here') {window.location.href = 'http://localhost:8000/login.html';}});xhr.open("POST", "http://localhost:8000");xhr.send();'>

Aber das ist verrückt hässlich und fast unmöglich zu lesen. Ich würde vorschlagen, diesen HTML-Code in etwas wie folgt umzuwandeln:

<!-- index.html -->

<script>
    function handleSubmit () {
      let xhr = new XMLHttpRequest();
      xhr.addEventListener("load", function(){
        var response = JSON.parse(this.responseText);

        /* check response if you need it: */
        if (response.your_response === 'here') {
          window.location.href = 'http://localhost:8000/login.html'; // REDIRECT!!
        }
      });
      xhr.open("POST", "http://localhost:8000");
      xhr.send();
    }
</script>

<input type="submit" onclick="handleSubmit()">
12
slebetman

Sie sollten express verwenden, wenn Sie mit der Webanwendung von node js arbeiten, es sei denn, Sie haben ein internes Verständnis der aktuellen Knotenversion, die Sie mit einem Vorschlag verwenden. 

Express ist einfach und Ihr Code würde so aussehen (und umleiten)

app.get('/index.html',function(req,res,next){
   res.redirect('/path/to/redirect/file')
}

link: http://expressjs.com/de/4x/api.html#res.redirect

0
MIchael Odumosu