Node.js : 在同一页面上做出响应（更新页面）答案

【问题标题】：Node.js : Make a response on the same page (update the page)Node.js : 在同一页面上做出响应（更新页面）
【发布时间】：2019-07-30 00:50:40
【问题描述】：

我有这种情况：客户提交表格。 node.js 用其适当的路由“捕获”表单提交并开始缓慢的计算。计算创建了一些必须传递给客户端的数据。

在这里我可以选择执行 res.render() 并向客户端呈现一个新的 html 文件。

如果我想让数据（字符串或字符串数组）在同一页面上对客户端可见怎么办？

我可以用 res.json() 以某种方式做到这一点吗？如果是，客户端和服务器端的代码结构如何？

【问题讨论】：

为什么不使用 ajax

标签： javascript node.js json forms express

【解决方案1】：

客户端 (jquery)

$(".submit").click(function(){
    var status = "submit";
    var userObject= {
        firstName: "<%= ['firstName'] %>",
        lastName: "<%= ['lastName'] %>",
        subject: "<%= ['subject'] %>"
    }
    $.ajax({
        url: "http://localhost:3000/yourUrl",
        type: "POST",
        data: JSON.stringify({status:status, userObject:userObject}),
        dataType: "json",
        contentType: "application/json",
        success: function(result){
            alert(result.status);
        },
        error: function(result){
            alert("error");
        }
    })
})

服务器端 (node.js)

app.post("/yourURL", function(req,res){

    console.log("working")

    var status = JSON.stringify({
        status: req.body.status,
        userObject: req.body.userObject
    })

    console.log("status: " + req.body.status)

    const options = {
        hostname: "localhost",
        port: 3000,
        path: '/postWhichRenderthePage',
        method: 'POST',
        headers: {
            'content-type': 'application/json',
            'accept': 'application/json'
        }
    };

    console.log(status);

    const reqs = http.request(options, (res) => {
        res.setEncoding('utf8');
        res.on('data', (chunk) => {
            console.log(`BODY: ${chunk}`);
        });
        res.on('end', () => {
            console.log('No more data in response.');
        });
    });

    reqs.on('error', (e) => {
        console.error(`problem with request: ${e.message}`);
    });

    // write data to request body
    reqs.write(status);
    reqs.end();
    res.status(200).send(JSON.stringify({status: req.body.status}));
})

供您参考如何使用ajax https://www.w3schools.com/xml/ajax_xmlhttprequest_response.asp

【讨论】：

我觉得代码应该能让你理解