为什么将XMLHttpRequest中的对象发送到Node / Express服务器为空?

杰杰

我正在尝试制作一个包含电子邮件地址并发送回事务性电子邮件的表格。我在香草JavaScript中使用XMLHttpRequest将数据发送到服务器,但是当我查看从index.html发送的数据时,它在服务器端只是一个空对象。

在后端,我正在使用Node and Express和Nodemailer。Nodemailer正常工作。我一直试图找出为什么查询对象中没有任何内容。

// Here is server.js

var express = require('express');
var nodemailer = require('nodemailer');
var app = express();

// Send index.html
app.get('/', function(request, response) {
  response.sendfile('index.html');
});

// Where I should receive data from JS written in index.html
app.post('/send', function(req, res) {
  var mailOptions  =   {
    to: req.query.to,
    subject: req.query.subject,
    text: req.query.text
  }
});
<!-- Here is my index.html with some JS in it -->

<div>
  <input id="to" type="text" placeholder="Email" />
  <input id="subject" type="text" placeholder="subject" />
  <textarea id="content" cols="20" rows="2" placeholder="Write something"></textarea>
  <button id="submit">Submit</button>
</div>

<script>
  // When #submit is clicked it invokes a function to collect values and then makes a XMLHttpRequest like bellow
  data = {to: to, subject: subject, text: text};
  var request = new XMLHttpRequest();
  request.open('GET', 'http://localhost:3000/send', true);
  request.send(data);
  }
</script>

yangli1990

在此之前可以做的几件事

  • 在决定要使用GET还是POST时,您似乎对使用哪一个感到困惑。我会使用POST,因为您正在尝试发送电子邮件数据,而不是真正尝试从服务器获取数据。
  • 更改您的app.post节点功能(假设您要发布)
  • 您需要将字符串发送到服务器,因此json stringify
  • 由于您的字符串为json格式,因此您需要将标题“ Content-Type”更改为“ application / json”
  • 您需要将请求谓词更改为“ POST”以匹配您的服务器以及您要完成的任务

在您的服务器中,您需要将app.post代码替换为(您需要npm install body-parser)

var bodyParser = require('body-parser');
app.use(bodyParser.json()); // for parsing application/json
app.use(bodyParser.urlencoded({ extended: true })); // for parsing application/x-www-form-urlencoded
// Where I should receive data from JS written in index.html
app.post('/send', function(req, res) {
  var mailOptions  =   {
    to: req.body.to,
    subject: req.body.subject,
    text: req.body.text
  }
});

这应该在客户端上起作用

data = {to: to, subject: subject, text: text};
var request = new XMLHttpRequest();
request.open('POST', 'http://localhost:3000/send', true);
xmlhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
request.send(JSON.stringify(data));

XMLHttpRequest的替代解决方案

或者,您可以通过HTTP api在此库中查找糖-axios

如果您使用的是axios,它就像

data = {to: to, subject: subject, text: text};
axios.post('/user', data);

或者如果您想控制收到回复后会发生什么。

data = {to: to, subject: subject, text: text};
axios.post('/user', data)
  .then(function (response) {
    console.log('success');
  })
  .catch(function (response) {
    console.log('error');
  });

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

将请求主体发布为空-XMLHttpRequest到Express服务器

通过XMLHttpRequest将纯文本发送到Express服务器

将BLOB发送到Node.js API会导致服务器上的主体为空

Volley将空参数发送到服务器

使用 Axios 将 Blob 发送到服务器,接收空对象

为什么Chrome和IE将“ Mozilla 5.0”放入它们发送到服务器的User-Agent中?

Angular 发布请求将空正文发送到 node.js 服务器

为什么我的formdata.append没有将键值对发送到服务器?

JavaPNS为什么将生产推送消息发送到沙盒服务器?

为什么我的PrintWriter没有将数据发送到服务器?

Express服务器发送空的PDF文件

POST请求发送到服务器后,回显消息为空

为什么我的表单中的选择输入字段没有发送到服务器?

尝试使用volly将POST从android发送到节点服务器,但是json主体在服务器上为空

如何将多个json对象的数据发送到android中的服务器?

将图像发送到Android中的服务器

有什么简单的方法可以将输入文本发送到AngularJS中的服务器?

如何在Java中不使用XMLHttpRequest的情况下将数据发送到服务器?

Android-服务器中的JSON为空

将Null发送到Web服务中的对象列表

XMLHttpRequest 没有将 POST 数据发送到 Django 服务器

如何通过节点js服务器将Json对象发送到express-handlebars html?

使用 stringify 时将未分配的 JSON 属性发送到服务器,即保留属性名称是否属性值为空/空

为什么我无法将POST登录信息发送到Spritg身份验证服务器?

为什么POST方法将两次表单数据发送到服务器?

将POST请求发送到服务器,服务器的响应为空,Angular-Spring-boot

图像上载:将Post64中的Base64发送到服务器或Express Js Middelware

为什么ProcessExecutionEngine总是将空输入参数发送到Web服务?

使用JS将JSON文件发送到Express服务器