javascript - 在节点服务器中发布请求后更改浏览器 url
问题描述
我正在实现一个注册页面,我想在提交表单并发送发布请求后更改浏览器 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);
请求处理程序.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 文件夹中。顺便说一句,我不想使用任何库/框架。
解决方案
您可以使用 vanilla js 导航到新页面。
xhr.onreadystatechange = function() {
if(xhr.readyState === 4 && xhr.status === 200) {
alert('Signed in successfully!');
document.location.href = {Your_new_URL}
}
}
如果文件路径可能不同 - 您始终可以在服务器上的响应 JSON 中指定它并在 XHR 成功回调中使用它。
推荐阅读
- android - 在 Koltlin 中膨胀类片段时出错
- c# - 在 C# 中查找键值对的快速方法
- bash - Stata 没有看到 ODBC 连接所需的环境变量
- jsf - Primefaces 在 DOM 中复制元素
- python - 是否可以在 PySpark 中对 DataFrame 进行去标记化?
- centos - Firewalld - 我做错了什么(允许来自单一来源的端口,阻止其他人使用相同的端口)
- python - PyQt,文本光标
- c# - 上传文件并重新加载相同的局部视图
- sql - 用于查找未包含项目的 sql 查询
- amazon-web-services - AWS CLI restore-from-cluster-snapshot 在账户中找不到快照