来自express js的Ajax发布响应不断抛出错误
Posted
技术标签:
【中文标题】来自express js的Ajax发布响应不断抛出错误【英文标题】：Ajax post response from express js keeps throwing error 【发布时间】：2013-04-10 20:18:25 【问题描述】：我很难支持从 html 页面到我的 node.js 应用程序然后返回到 html 页面的双向数据传输。
我很确定我已经找到了正确的解决方案，但我只是没有让它发挥作用。
我正在为我的 node.js 应用程序使用以下内容：
var express = require('/usr/lib/node_modules/express');
var app = express();
app.use(function(err, req, res, next)
console.error(err.stack);
res.send(500, 'Something broke!');
);
app.use(express.bodyParser());
app.post('/namegame', function(req, res)
console.log('Got request name: ' + req.body.name);
setTimeout(function()
var newName = "New Name-O";
res.send(name: newName);
, 2000);
);
app.listen(8088, function() console.log("Server is up and running"); );
以下是我的html页面：
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script type="text/javascript">
// wait for the DOM to be loaded
$(document).ready(function()
alert("Got here!");
function DisplayName(response)
alert(response.newName);
$("#NameGameIt").click(function(event)
alert("How about now?");
//event.PreventDefault();
var nameSubmitted = document.getElementById("name");
//var nameSubmitted = "help!!";
alert("Name: " + nameSubmitted.value);
$.ajax(
type: "POST",
url: "http://127.0.0.1:8088/namegame",
data: name: nameSubmitted.value,
dataType: "json",
timeout: 2500,
success: function() alert("???");,
error: function(error1, error2, error3)
alert("error"); ,
complete: function(arg1, arg2, arg3)
alert("complete");
);
);
);
</script>
</head>
<body>
<h1>Test form for Ajax</h1>
</br>
Name: <input type="text" id="name" name="name"></br>
<input type="button" value="NameGameIt" id="NameGameIt">
</form>
</body>
</html>
所以，当我运行节点应用程序时，服务器运行良好。当我启动 html 页面时，我收到警报“到了这里！”当我按下“NameGameIt”按钮时，我会收到“现在怎么样？”的警报。然后是警报“名称：”+我输入的任何名称。一旦我单击该警报，节点应用程序会立即看到帖子并将名称打印到控制台。两秒钟后，当节点发送响应时，浏览器将直接进入 ajax 帖子上的错误处理程序。错误处理程序中唯一有用的数据是它是一个没有真正用处的“错误”。
所以我知道消息正在从 html 页面到达节点，因为它会打印出我发送的名称，并且我知道 html 页面正在从节点获取消息，因为在超时之前它不会出错在节点上发生触发发送。但是，我不知道为什么它继续将我发送到错误处理程序而不是成功。我已经使用 node-inspector 逐步完成了节点代码，它似乎使用 200 成功代码正确构建了数据包，它在完成数据包制作后调用 .end 内部 .send 所以我不认为其中任何一个都在咬我。
我快疯了！如果有人看到我遗漏的内容或对收集更多信息的方法有任何新想法，我将非常感谢您的帮助。
【问题讨论】：
您是否因为浏览器控制台中的同源策略而被拒绝访问？ @Kevin B 浏览器控制台根本没有显示任何类型的消息，只是没有声明关于我的 HTML 文档字符编码的警告消息。 . .我认为我可以安全地忽略 【参考方案1】：您的代码非常好，但几乎可以肯定您遇到了跨域 AJAX 请求问题。您可能在本地文件系统上打开此 HTML 文件并以这种方式发出请求，这就是导致此问题的原因。
要修复它，请像这样添加app.use(express.static('public'));：
var express = require('/usr/lib/node_modules/express');
var app = express();
app.use(function(err, req, res, next)
console.error(err.stack);
res.send(500, 'Something broke!');
);
app.use(express.bodyParser());
app.use(express.static('public'));
app.post('/namegame', function(req, res)
console.log('Got request name: ' + req.body.name);
setTimeout(function()
var newName = "New Name-O";
res.send(name: newName);
, 2000);
);
app.listen(8088, function() console.log("Server is up and running"); );
然后将您的 html 文件放在“公共”文件夹中。启动服务器后，您可以访问http://127.0.0.1:8088/file.html，您的代码将运行良好。
【讨论】：
非常感谢您为我指明了正确的方向。我在这方面的罪过很大，我只是在我的浏览器中直接从我的文件系统中运行 html，就像你想象的那样。此外，我刚刚从头开始创建我的节点应用程序，没有使用快速工具，所以。 . .我返回并使用命令“express -s -e expressTest”创建了我的节点应用程序，该命令为我创建了您所指的公用文件夹。一旦我把我的 html 放在那里并将我的 post 处理程序放在它创建的 app.js 中，一切都像魔术一样工作。非常感谢您的帮助。 给遇到类似问题的任何人的说明，我建议检查 faye 并查看它是否可以满足节点和网页通信需求。我今天找到了它，到目前为止我已经取得了很好的成功。发布/订阅对我来说是一个熟悉的范例，我一直在祈祷我没有找到任何哥特式，因为到目前为止我真的很喜欢它。【参考方案2】：在我的情况下，将此添加到 app.js 作品中。
app.use(function(req, res, next)
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
);
https://enable-cors.org/server_expressjs.html
【讨论】：
以上是关于来自express js的Ajax发布响应不断抛出错误的主要内容，如果未能解决你的问题，请参考以下文章