Javascript 从HTML表单向Node.js服务器发送数据_Javascript_Html_Node.js_Post

Javascript 从HTML表单向Node.js服务器发送数据

javascript html node.js post

Javascript 从HTML表单向Node.js服务器发送数据,javascript,html,node.js,post,Javascript,Html,Node.js,Post,我正在学习Node.js 我的服务器中有以下内容： var http = require("http"); var url = require("url"); http.createServer(function(request, response){ response.writeHead(200, {"Content-Type":"text/plain"}); var params = url.parse(request.url,true).query; conso

我正在学习Node.js

我的服务器中有以下内容：

var http = require("http");
var url = require("url");

http.createServer(function(request, response){
    response.writeHead(200, {"Content-Type":"text/plain"});
    var params = url.parse(request.url,true).query;

    console.log(params);

    var a = params.number1;
    var b = params.number2;

    var numA = new Number(a);
    var numB = new Number(b);

    var numOutput = new Number(numA + numB).toFixed(0);

    response.write(numOutput);
    response.end();
}).listen(10000);

类似这样的URL:

localhost:10000/？number1=50000&number2=1

在我的浏览器上回显50001，因此它可以工作

如果不使用Express，我需要使用HTML通过表单发送这两个参数

如何做到这一点？

简单的答案是。浏览器将表单数据转换为您正在处理的查询字符串参数

如果需要

发布

，HTML表单将作为请求实体主体发布。在节点中，

ClientRequest

（示例中的

request

变量）会在每次主体块到达服务器时发出一个

data

事件您不会一次收到整个正文。您必须缓冲，直到收到整个正文，然后解析数据

这是很难做到的，因为分块编码与普通的

传输编码

以及浏览器提交表单数据的不同方式。我只想使用（这是Express在幕后使用的），或者至少研究一下它如何处理表单帖子，如果您必须实现自己的表单帖子的话。（事实上，这样做只是为了教育目的——我再怎么强调也不过分，你应该用“强大”来做任何可能最终投入生产的事情。）

我这样解决了我的问题：

sum.js：

var http = require("http");
var url = require("url");

http.createServer(function(request, response){
    response.writeHead(200, {"Content-Type":"text/plain"});
    var params = url.parse(request.url,true).query;

    console.log(params);

    var a = params.number1;
    var b = params.number2;

    var numA = new Number(a);
    var numB = new Number(b);

    var sum = new Number(numA + numB).toFixed(0);

    response.write(sum);
    response.end();
}).listen(10001);

Index.html：

<html>
    <head>
            <title> Pedir random </title>

            <script type="text/javascript">
                function operacion(){
                        var n1 = document.getElementById("num1").value;
                        var n2 = document.getElementById("num2").value;

                        location.href = "http://localhost:10001" + "?number1=" + n1 + "&number2=" + n2;
                }
            </script>

    </head>

    <body>
            <h1>Inserte dos números </h1>
            <form id="forma1"> 
                <input type="text" id="num1"></input>
                <input type="text" id="num2"></imput>
                <input type="button" onClick="operacion()" id="enviar" value="enviar"></input>
            </form>
    </body>

<html>


Pedir随机
函数操作（）{
var n1=document.getElementById（“num1”）.value；
var n2=document.getElementById（“num2”）.value；
location.href=”http://localhost:10001“+”？number1=“+n1+”&number2=“+n2；
}
努梅罗斯酒店

不知道这样做是否正确，但它解决了我的需要。

您的翡翠形状（假设您使用的是express）应该如下所示：

form(action="/" method="post")
    input( name="whateverSearch" placeholder="search" autofocus)

然后要传递新提交的数据点

whateverSearch

，您可以使用

req.body

查找它（见下文）。在这里，我获取了数据点并将其记录到控制台，然后将其提交到DOM，以及页面的标题

router.post('/', function(req, res) {
    whateverSearch = req.body.whateverSearch;
    console.log(whateverSearch);
    res.render('index', { title: 'MyApp', inputData: whateverSearch});
});

@Andy897-已经看过了。然而，我的老师不想让我使用Express，没有理由在浏览器中这样使用JavaScript。将其更改为

和

，您就完成了。