从网页发送 post 到 Node.js 服务器...不使用 'fetch'...？

Question

我在网页上使用以下 javascript 将信息发送到图像上 "click" 上的 Node.js 服务器。这是使用 'POST' 请求。

<script>

function rerouter(_sent) {

 var _people = <%- JSON.stringify(member_list) %>;  
   //convert the passed ('member_list') array into a JSON string...
 var _attend = <%- JSON.stringify(online) %>;  
   //convert the passed ('online') array into a JSON string...

 var splits = _sent.id.split("_");  //"split" on "underscore ('_')"

  if (_people.indexOf(splits[1]) != -1) {

  //**SEND INFO TO SERVER...

  var available = _attend[_people.indexOf(splits[1])];  

  var response = fetch("members/pages/:" + splits[1] + "/presence/:" + available, {
   method: 'POST',
   headers: {
    'Content-Type': 'text/plain;charset=utf-8'
   }
  });

  //**

  }  //'_people' array contains the member name ('splits[1]')...

 }

 </script>

这里我在 Node.js 服务器代码中处理请求：

var bodyParser = require('body-parser')

// create application/json parser
var jsonParser = bodyParser.json()

// create application/x-www-form-urlencoded parser
var urlencodedParser = bodyParser.urlencoded({ extended: false })

app.post('/members/pages/:membername/presence/:online', urlencodedParser,  function (req, res) {
console.log("I RECEIVED FROM CLIENT THE FOLLOWING:")
console.log(req.params)
console.log(req.body)

res.redirect('/_landing');
})

这是我的控制台输出：

I RECEIVED FROM CLIENT THE FOLLOWING:
{ membername: ':Nica', online: ':Yes' }
{}

从我的输出中可以看出，POST 路由似乎在某种程度上起作用。但是我的 'redirect' 命令没有执行...网页没有按应有的方式更改为“_landing”页面...我认为这可能是因为我正在使用 'fetch' 发送 POST 请求...？？？有人可以验证这是否是原因（或另一个问题是原因）以及我如何能够纠正问题？

此外，为什么我的 'params' 在登录到控制台时包含冒号（“:”）...这是标准的吗？我不认为它会在日志中包含冒号，只包含实际数据。

基本上我的 POST 似乎几乎可以正常工作...但不完全是。任何建议将不胜感激。我先谢谢你了。

更新：我做了一些更改，我的 POST 现在似乎工作正常。在我的前端网页中，我使用以下内容发出 HTTP POST 请求：

<script>

function rerouter(_sent) {

 var _people = <%- JSON.stringify(member_list) %>;  
   //convert the passed ('member_list') array into a JSON string...
 var _attend = <%- JSON.stringify(online) %>;  
   //convert the passed ('online') array into a JSON string...

 var splits = _sent.id.split("_");  //"split" on "underscore ('_')"

  if (_people.indexOf(splits[1]) != -1) {

  //**SEND INFO TO SERVER...

  var available = _attend[_people.indexOf(splits[1])];  

  fetch('/members/pages/callup', {
   method: 'post',
   headers: {
     'Accept': 'application/json, text/plain, */*',
     'Content-Type': 'application/json'
   },
   body: JSON.stringify({name: splits[1], presence: available, str: 'Some string: &=&'})
  })

  //**

  }  //'_people' array contains the member name ('splits[1]')...

 }

 </script>

...并在我的 Node.js 脚本中修改了我的路由处理程序：

// create application/json parser
var jsonParser = bodyParser.json()

app.post('/members/pages/callup', jsonParser, function (req, res) {
console.log("I RECEIVED FROM CLIENT THE FOLLOWING:")
console.log(req.body)

res.redirect('/_landing');
})

这是功能...接收从前端网页发送的数据。

唯一剩下的问题是为什么 'redirect' 不开火...？？？我仍然觉得通过使用 'fetch' 这会以某种方式干扰页面重定向...？提取通常用于等待服务器的响应，在我的情况下，我对该功能不感兴趣，我只想从前端向后端单向发送数据……然后重定向前端页面。我想不出重定向没有触发的任何其他原因......？

Answer 1

使 extented:true 而不是 false 为

var urlencodedParser = bodyParser.urlencoded({ extended: true }) 并将此行移至以下语句上方，

var jsonParser = bodyParser.json() 并检查它是否有效。

最后把你的 headers 改成

headers: {
    'Content-Type': 'text/plain;charset=utf-8'
}

给，

headers: {
    'Content-Type': 'application/json'
}

希望这能解决问题。

从网页发送 post 到 Node.js 服务器...不使用 'fetch'...？

send post from webpage to Node.js server ...do not use 'fetch'...?

html

http-post

node.js