Question

是否可以使用AJAX XMLHttpRequest（）将数据从客户端javascript页面发布到节点服务器（server.js）？我正在寻找的是将在节点服务器上接收数据的javascript代码，特别是member_nm（＆＃34; newName＆＃34;）和member_email（＆＃34; mail@google.com"）的值。我控制服务器。我也明白我也可以使用GET通过查询字符串发送文本值。以下是通过事件处理程序从客户端javascript页面发送的请求：

document.getElementById("btnAddMember").addEventListener("click", function()
{
  var request = new XMLHttpRequest();
  var path = "/Users/Admin/WebstormProjects/projectName/server.js";
  request.onreadystatechange = function()
  {
    if ( request.readyState === 4 && request.status == 200 )
    {
      request.setRequestHeader("Content-Type", "text/plain; charset=UTF-8");
      request.open("POST", path, true);
      request.send("member_nm=newName&member_email=mail@google.com"); 
    }
  };
});

Answer 1

您需要设置服务器以接受此帖子请求，最简单的方法是将Express与bodyParser中间件一起使用，如下所示：

var express = require('express');
var    server=express();
var    bodyParser= require('body-parser'); 

server.use(bodyParser.json());

server.post('/', function(req, res){
  if(req.body){
   // get the params from req.body.paramName
}
});

server.listen(8222, function(){
  console.log('listening for requests ..')
});

在你的客户端代码中，将'path'更改为指向服务器url：port，我将把它们放在onReadyStateChange之外：

request.setRequestHeader("Content-Type", "text/plain; charset=UTF-8");
  request.open("POST", path, true);
  request.send("member_nm=newName&member_email=mail@google.com");

Answer 2

这是一个有效的解决方案，介绍如何使用Express将变量从客户端javascript文件发送到节点服务器。 POST通过事件处理程序btnAddMember在客户端上启动。 txtName.value和txtMembershipType.value包含要发布的值。请注意正确解析值所需的语法。 member_nm和member_type将用于引用节点服务器上的属性。首先是客户端javascript：

document.getElementById("btnAddMember").addEventListener("click", function()
{
  var request = new XMLHttpRequest();
  var path = "http://0.0.0.0:0000"; // enter your server ip and port number
  request.open("POST", path, true); // true = asynchronous
  request.setRequestHeader("Content-Type", "application/json; charset=UTF-8");
  var text= '{"member_nm":"' + txtName.value + '","member_type":"' + txtMembershipType.value + '"}';
  request.send ( text );
});

接下来是服务器端代码。请注意，bodyParser现在必须作为node_module添加到项目中。这可以通过节点程序管理器（npm）完成。 POST语句基本上使用名为“member”的变量将req.body从JSON格式解析为javascript对象格式。然后，代码记录两个变量member_nm和member_type的已发布值。最后，如果POST成功，则会向客户端发送响应状态。

var bodyParser = require("body-parser");
...
app.use(bodyParser.text({ type: "application/json" }));
...
// receive the POST from the client javascript file
app.post("/", function (req, res)
{
  if (req.body)
  {
    var member = JSON.parse( req.body ); // parse req.body as an object
    console.log("member_nm: " + member.member_nm );
    console.log("member_type: " + member.member_type );
    res.sendStatus(200); // success status
  }
  else
  {
    res.sendStatus(400); // error status
  }
});

将数据从客户端javascript页面POST到节点服务器

2 个答案: