Question

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

在这里，我可以选择执行res.render（）并将新的html文件呈现给客户端。

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

我可以使用res.json（）以某种方式执行此操作吗？如果是，那么在客户端和服务器端的代码结构如何？

Answer 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

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

1 个答案: