通过Node.js将客户端表单输入发送到服务器端数据库查询,并将结果返回给客户端

时间:2022-06-20 15:59:57

I am developing a web application where the user can type in a "device id" on the web page (we have 100's of devices out on the field in production use each with a unique ID), that result entered by the user will be sent to the Node.js server that in return will store it into a variable and use it in a SQL Query to retrieve results about that particular device from the database server and then display the results back to the client web page.

我正在开发一个Web应用程序,用户可以在网页上键入“设备ID”(我们在生产中使用100个设备,每个设备都使用唯一的ID),用户输入的结果将被发送到Node.js服务器,作为回报,它将把它存储到一个变量中,并在SQL查询中使用它来从数据库服务器检索有关该特定设备的结果,然后将结果显示回客户端网页。

Currently the form input feature has not been implemented yet even though I've already coded the form code in html.

目前,即使我已经用html编写了表单代码,表单输入功能还没有实现。

The program works fine as it is if I were to manually change the DEVICE_ID to the device I wish to retrieve data from in the code but of course I want to be able to enter this on the client page instead of me having to change it in the server-side source code manually.

该程序工作正常,如果我手动将DEVICE_ID更改为我希望从代码中检索数据的设备,但当然我希望能够在客户端页面上输入此而不是我必须在手动提供服务器端源代码。

"use strict";
var pg = require('pg').native;
var http = require('http');
var $ = require('cheerio');
var fs = require('fs');
var url = require('url');

var htmlString = fs.readFileSync('index.html').toString();
var parsedHTML = $.load(htmlString);

var dbUrl = "tcp://URL HERE/";

// The Sign-ID
var DEVICE_ID = '2001202';

// Create the http server
http.createServer(function (request, response) {
    var request = url.parse(request.url, true);
    var action = request.pathname;

    // Connect and query the database
    pg.connect(dbUrl, function(err, client) {
        // The complete sql query for everything that's needed for the app!
        client.query("SQL QUERY IS HERE" + DEVICE_ID + "etc..", 
            function (err, result) {
                // Remaining program code is here that performs DOM based 
                // manipulation to display results returned from the server
                // to the client side page.

                // Time to Render the document and output to the console
                console.log(parsedHTML.html());

                // Render the document and project onto browser
                response.end(parsedHTML.html());
            }
        ); // End client.query
    }); // End pg.connect
}).listen(8080); // End http.CreateServer

pg.end();

I've considered the following: 1) Use An OnClick() function from within the HTML code, like this:

我考虑过以下几点:1)在HTML代码中使用OnClick()函数,如下所示:

onclick="lookupSignID()

Then include an external JS file from within the HTML that includes the lookupSignID() function however I soon found out this is only performing client-side function and is not what I want.

然后在HTML中包含一个包含lookupSignID()函数的外部JS文件,但我很快发现这只是执行客户端函数而不是我想要的。

2) AJAX is only good for if the server is generating new information by itself, therefore I can't use AJAX since the user is entering the device ID to get information from it.

2)AJAX仅适用于服务器自身生成新信息的情况,因此我无法使用AJAX,因为用户输入设备ID以从中获取信息。

3) Possibly using POST/ GET

3)可能使用POST / GET

Can anyone please advise on what course of action I should take? If solution (3) is the best way how would I go about doing this? Can it be integrated into my existed code (shown above) without many changes?

任何人都可以告诉我应该采取什么行动?如果解决方案(3)是最佳方式,我将如何做到这一点?是否可以将其集成到我现有的代码中(如上所示)而无需进行多少更改?

Thanks!

1 个解决方案

#1


0  

If you used jQuery on the client side with an AJAX POST function, and then on the server side, you have express.js, you could do this:

如果你在客户端使用jQuery和AJAX POST函数,然后在服务器端,你有express.js,你可以这样做:

app.post('/deviceid', function(req, res) {
   var deviceid = req.param('deviceid')
   console.log(deviceid)
   ...
})

#1


0  

If you used jQuery on the client side with an AJAX POST function, and then on the server side, you have express.js, you could do this:

如果你在客户端使用jQuery和AJAX POST函数,然后在服务器端,你有express.js,你可以这样做:

app.post('/deviceid', function(req, res) {
   var deviceid = req.param('deviceid')
   console.log(deviceid)
   ...
})