在节点服务器中发布请求后更改浏览器 url答案

【问题标题】：Change browser url after post request in node server在节点服务器中发布请求后更改浏览器 url
【发布时间】：2020-03-29 12:23:00
【问题描述】：

我正在实现一个注册页面，我想在提交表单并发送发布请求后更改浏览器 URL。实际上，我希望服务器在收到发布请求后提供另一个静态文件。我该怎么做？

这是我在客户端使用 vanilla js 的 xhr 请求：

function signup(e) {
        var data = {
            name: _elements.fullname.value,
            username: _elements.username.value,
            password: _elements.password.value
        };

        data = JSON.stringify(data);

        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if(xhr.readyState === 4 && xhr.status === 200) alert('Signed in successfully!');
        }
        xhr.open('POST', 'signup', true);
        xhr.setRequestHeader('Content-Type', 'text/plain')
        xhr.send(data);
    }

这是我的 server.js 文件：

const http = require('http');
const requestHandler = require('./req-handler').requestHandler;

http.createServer(requestHandler).listen(8080);

req-handler.js:

if (req.method === 'GET') {
        switch (req.url) {
            case '/':
                routeHandler = rootHandler;
                break;
        }
    } else if (req.method === 'POST') {
        switch (req.url) {
            case '/signup':
                routeHandler = signupHandler;
                break;
        }
    }

    if (!routeHandler) {
        routeHandler = staticFileHandler;
    }

    routeHandler(req, res);


    function rootHandler(req, res) {
        req.url = 'signup.html';
        staticFileHandler(req, res);
    }

    function signupHandler(req, res) {
        req.url = 'index.html';
        var jsonData = '';

        req.on('data', data => {
            jsonData += data.toString('utf-8')
        });

        req.on('end', () => {

            staticFileHandler(req, res);
        });
    }


    function staticFileHandler(req, res) {
        console.log(req.url)
        fs.readFile('client/' + req.url, function (err, data) {
            if (err) {
                res.writeHead(500);
                res.write(err.name);
                res.end();
            }
            console.log(data)
            res.writeHead(200);
            res.write(data);
            res.end();
        });
    }

所有静态文件（.html 和 .css）都在 /client 文件夹中。顺便说一句，我不想使用任何库/框架。

【问题讨论】：

标签： javascript node.js xmlhttprequest

【解决方案1】：

您可以使用 vanilla js 导航到新页面。

xhr.onreadystatechange = function() {
    if(xhr.readyState === 4 && xhr.status === 200) {
        alert('Signed in successfully!');
        document.location.href = {Your_new_URL}
    }
}

如果文件路径可以变化 - 您始终可以在服务器上的响应 JSON 中指定它并在 XHR 成功回调中使用它。

【讨论】：