从Express中的POST请求更新页面内容

Question

我遇到了一个问题，我尝试通过表单完成的POST请求更新网页内容，但问题是变量设置为全局范围，每次刷新页面时内容仍然存在。有人解释了问题是什么，并告诉我，我可以“... 使帖子返回一个带有数据的JSON对象而不是重定向。然后从客户端执行POST异步并显示数据。” em>“这是我正在使用的代码：

快递：

var data;
var url;

/* GET home page. */
router.get('/', (req, res, next) => {
    res.render('index', { 'data': data});
});

/* POST HANDLER */
router.post('/link', function(req, res, next) {
    var pattern = /^((http|https|):\/\/)/;
    url = req.body.link;

    if (!pattern.test(url))
    {
        url = "http://" + url;
        bitly.shorten(url)
        .then(response => {
            data = response.data.url;

            res.redirect("/");
        });
    }
});

我正在使用jQuery进行POST请求：

$('#shortLink').on('click', () => {
    $.ajax({
        type: 'POST',
        url: '/link',
        data: {link: $('#linkInput').val()},
        success: data => {
            console.log(data);
        }
    });
});

我想要做的是获取输入的值，将其发送到Express上的POST处理程序，然后将该信息传递回主页，而不必离开页面;像一个常见的Ajax请求。上面有人可以详细说明我的建议吗？或者给我另一个解决方案。

Answer 1

没有规则说你必须在处理邮件请求后重定向。只需通过res.json({'url': response.data.url})发回数据，然后在 $。ajax 成功处理程序中，即可通过data.url获取数据。