Javascript post请求后重定向到另一个url（AJAX、EXPRESS）

作为learning node.js服务器的一部分，我正在开发一个小的登录网站。您可以打开一个站点并输入用户名，然后通过ajax post请求将用户名发送到服务器，并保存到所有用户的数组中。我想这样，在你提交用户名后，你将被重定向到另一个页面，每个用户名都是唯一的，在那里你将能够看到关于你用户名的信息。有点像“管理您的帐户”网站

然而，在我提交用户名后，我似乎无法找到一种方法将我重定向到这个页面

比如说，你提交了一个用户名“kokot”，这是迄今为止提交的第三个用户名。因此，在“players”数组中，您的用户对象看起来像这样

{id:2，username:'kokot'}

。 现在我想将您重定向到url以查看有关您的特定用户名的信息

节点JS

const express = require('express');
const server = express();
const bodyParser = require('body-parser');

server.use(bodyParser.urlencoded({extended: false}));
server.use(bodyParser.json());

let players = [];

//loads the home page
server.get('/', (req, res) =>{
    res.sendFile(__dirname + '/home.html');
});

//loads the page with the list of players
server.get('/players', (req, res) =>{
    res.send(players);
});

server.get('/player/:id', (req, res) =>{
    res.send(players[req.params.id]);
});

//takes a new username and saves it to players array
server.post('/', (req, res) =>{
    console.log('NEW PLAYER: ' + req.body.username);

    players.push({
        id: players.length,
        username: req.body.username
    });
});








/////////////////////////////////////////////////////////////////////////////
server.listen(2000, () => console.log('LISTENING ON PORT 2000'));

HTML

家
PISKVOREC
用户名
$（文档）.ready（（）=>{
让homeUrl为您服务http://localhost:2000';
让$userForm=$（'#userForm'）；
让$userFormSubmit=$（'#userFormSubmit'）；
//向服务器提交新用户名
$userFormSubmit。单击（（）=>{
$.post（homeUrl{
用户名：$（'#userFormInput'）.val（）
}，函数（）{
log（'USERNAME SUBMITTED TO SERVER'）；
});
$.
});
////////////////////
});

感谢您的回复和想法

祝你度过愉快的一天

当然可以，请参见以下内容：

server.post('/', (req, res) =>{
    console.log('NEW PLAYER: ' + req.body.username);

    players.push({
        id: players.length,
        username: req.body.username
    });

    res.redirect(`/player/${req.body.username}`);
});

更新 使用vanilla Express.js应用程序演示

app.js

var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'hbs');

app.use(bodyParser.urlencoded({extended: false}));
app.use(express.static(path.join(__dirname, 'public')));

app.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

app.post('/this', (req, res, next) => {
  res.redirect(`/that/${req.body.username}`);
});

app.get('/that/:id', (req, res, next) => {
  res.send(req.params);
});

module.exports = app;

index.hbs

<form method="post" action="/this">
    <input id="username" name="username" value="vader" type="text" />
    <button type="submit">Submit</button>
</form>

提交

---

导致重定向到：

http://localhost:3000/that/vader

不知怎的，它不起作用了……我添加了你写的那句话，但在提交后，它仍停留在页面上。嗯，我只是在上面测试了一下，效果很好。您的代码中一定有其他导致问题的内容。您共享的url看起来很奇怪，并且不确定它是如何生成的：server.post（“/”路由是否被命中？但是，$.post AJAX似乎触发了post请求（否则它不会将用户名保存到播放器数组中，它会这样做）但似乎没有执行回调函数，命令它在控制台中输出“USERNAME SUBMITTED to SERVER”，因为控制台中从来没有任何输出…idk这是怎么可能的，是的，SERVER.post rout肯定会被命中，因为它总是将“NEW USER”打印到cmd中…我猜你提到的url是某种类型的生成的默认表单url使用概念验证更新了答案。重定向按设计工作。请使用断点检查您自己的代码。干杯

<form method="post" action="/this">
    <input id="username" name="username" value="vader" type="text" />
    <button type="submit">Submit</button>
</form>