使用 ajax 向 Node.js 服务器发送 POST 请求答案

【问题标题】：POST request to Node.js server using ajax使用 ajax 向 Node.js 服务器发送 POST 请求
【发布时间】：2019-03-16 17:56:48
【问题描述】：

我是 Node.js 的新手。

我正在尝试向在端口 8080 上本地运行的 Node.js 服务器发出 POST 请求。

但它不起作用。

FireFox 阻止我的 POST 请求，因为它是跨域的

Reason: CORS request not HTTP

这是我的代码：

HTML

<html>
<head>
    <title>Progetto Start</title>
    <script src="..\Controller\Start.js"></script>
</head>
<body>
    <input type="button" id="btPostJSON" value="invia JSON" onclick="SendJSON()"/>
</body>
</html>

Start.js：

function SendJSON() {
xhr = new XMLHttpRequest();
var url = "127.0.0.1:8080";
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-type", "application/json");
xhr.onreadystatechange = function () { 
    if (xhr.readyState == 4 && xhr.status == 200) {
        var json = JSON.parse(xhr.responseText);
        console.log(json.email + ", " + json.name)
    }
}
var data = JSON.stringify({"email":"tomb@raider.com","name":"LaraCroft"});
xhr.send(data);
}

节点js服务器：

var http = require('http');

http.createServer(function (req, res) {
res.writeHead(200, {"Content-Type": "text/html"});
res.write(req.url);
res.end();
console.log(req.url);
}).listen(8080);

我正在将 url 打印到控制台并作为响应仅查看它是否有效有人已经解决了我的问题吗？

【问题讨论】：

http请求需要有express js或者类似的库。
基本上，您正在尝试发出 http 请求，但您的节点 js 中没有与该请求对应的任何内容。

标签： javascript html node.js http post

【解决方案1】：

请注意，只要服务器/api 的域与调用客户端的域不匹配，就需要 CORS。如果你客户端的端口号和服务器/api上的端口号不匹配，则域不匹配，需要CORS

无耻地从这里拉出来：[https://bigcodenerd.org/enable-cors-node-js-without-express/][1]

在您的 createServer 回调中，输入：

   const headers = {
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'OPTIONS, POST, GET',
    'Access-Control-Max-Age': 2592000, // 30 days
    /** add other headers as per requirement */
  };

  if (req.method === 'OPTIONS') {
    res.writeHead(204, headers);
    res.end();
    return;
  }

  if (['GET', 'POST'].indexOf(req.method) > -1) {
    res.writeHead(200, headers);
    res.end('Hello World'); //Replace this with your response logic
    return;

  }

if (req.method == "OPTIONS") 块是您的“飞行前”请求。这基本上只是用于检查资源的 cors 权限。

还有其他软件包可以为您做类似的事情。将“*”替换为您的特定客户端主机名（“something.com”）以获得更好的安全性。使用通配符 (*) 存在安全风险，因此在将某些内容投入生产之前，您需要将其更改为您希望允许访问您的 api 的任何域或 IP 地址。

【讨论】：

它告诉我应用程序没有定义
是快递js。您需要使用 npm 将其安装到您的项目中
我修改为纯节点。

【解决方案2】：

您的网址中缺少协议。将 http:// 添加到它，它应该可以工作。

var url = "http://127.0.0.1:8080";

【讨论】：

地址栏中的地址是什么？它还应该以 http://127.0.0.1:8080 开头，这样就不需要 CORS（同源）
您确定您的 JavaScript 没有被缓存并且带有“http://” URL 的版本被加载了吗？
如果页面的来源是http://127.0.0.1:8080，而你的AJAX请求的来源是http://127.0.0.1:8080，那么它们是同源而不是跨域，不需要CORS。在其他浏览器中尝试一下，看看是否会收到更有用的错误消息。
可能错误是由于我的 html 和 js 文件位于本地路径上，例如 file\\\c:/Desktop/prj ... ？
是的。很可能就是这种情况。使用 node.js 提供您的文件，以便它们来自侦听 127.0.0.1:8080 的服务器，而不是您的文件系统。像 express 这样的东西会很方便。