使用 ajax 将节点 js 变量传递给 html

passing node js variable to html using ajax

我正在尝试将 python json 结果从节点 js 传递到 html ajax。

我想做的是,从客户端获取一些输入,当点击提交按钮时,ajax 将变量发送到 Node JS,然后是 /data 中间件 运行是一个 python 脚本,它处理数据库并存储变量并显示结果。

到目前为止我所做的是,我可以从客户端获取输入,并使用 ajax 将变量从 html 发送到 Node JS,我也可以 运行 python 脚本并将变量存储到我的数据库中。我可以从后端看到结果。但我不知道如何将结果发送回 ajax 客户端。

以下是我的后端 Node JS 代码部分。

const express = require('express');
const app = express();
//  To use python script
var PythonShell = require('python-shell');

const bodyParser = require('body-parser');
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: true }));
// parse application/json
app.use(bodyParser.json());

app.use(express.static(__dirname + ''));
app.use(express.json());
app.engine('html', require('ejs').renderFile);

app.get('/data', function(req, res) {
    res.sendFile(__dirname + '/data.html');
});

app.post('/data', function(req, res) {
    const {name, ssn, state} = req.body;
    console.log('name: ',name, 'ssn: ',ssn,'state: ',state);
    var options = {
        mode: 'json',
        pythonPath:'',  
        pythonOptions:['-u'],
        scriptPath:'',
        args: [name,ssn,state]
    };
    PythonShell.PythonShell.run('dbPrac.py', options, function(err, res) {
        if(err) throw err;
        console.log('res[0]: ', res[0]);   
        //res.render(__dirname + '/data.html');
        res.send(res[0]);
        //res.status(200).send(res[0]);
    });
});

当我使用“res”时。方法,后端编译器总是说 “类型错误:res.send 不是一个函数”

下面是我的java脚本部分

<script>
    function sendAjax() {
        console.log('submit onclick.');
        const name = document.getElementById("name").value;
        const ssn = document.getElementById("ssn").value;
        const state = document.getElementById("state").value;
        console.log('name: ',name, 'ssn: ',ssn,'state: ',state);
        $.ajax({
            type: "post",
            url: 'http://localhost:8080/data',
            data: {name:name,ssn:ssn,state:state},
            dataType:'json',
            success: function(res) {
            console.log(res);
            }
        });
    }
</script>

以下是我的 html 文件部分,以备不时之需。

<form action="http://localhost:8080/data" method="post" id="signup">
    <h1>Personal info post example</h1>
    <div class="field">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name" placeholder="Enter your fullname" /><br><br>
        <small></small>
    </div>
    <div class="field">
        <label for="ssn">SSN:</label>
        <input type="text" id="ssn" name="ssn" placeholder="Enter your SSN" /><br><br>
        <small></small>
    </div>
    <div class="field">
        <label for="state">State:</label>
        <input type="text" id="state" name="state" placeholder="Enter your state" /><br><br>
        <small></small>
    </div>
    <button type="submit" onclick="sendAjax()">Submit</button><br><br>
    <span id="answer"></span> <br><br>
</form>

尝试更改 python 结果回调中的参数:

PythonShell.PythonShell.run('dbPrac.py', options, function(err, pythonRes) {
    if(err) throw err;
    console.log('pythonRes[0]: ', pythonRes[0]);   
    //res.render(__dirname + '/data.html');
    res.send(pythonRes[0]);