XMLHttpRequest响应为空
XMLHttpRequest响应为空
提问于 2018-06-10 04:17:18
您好，我是新手的网站开发。我有三个文件: index.html、myscript.js和server.js。index.html上的按钮调用myscript.js中的messageServer函数，该函数将XMLHttpRequest发送到在节点上运行Express的server.js。服务器收到请求，但myscript.js格式的响应始终为空。readyState先是1，然后是4。为什么是null？提前感谢
编辑:响应状态码为0
index.html：
<!DOCTYPE html>
<html>
<head>
<title id="title">Page Title</title>
<script src="myscript.js"></script>
</head>
<body>
<h1 id="header">Header</h1>
<form>
<input type="button" value="Message Server" onclick="messageServer();">
</form>
</body>
</html>myscript.js
function messageServer() {
const xhr = new XMLHttpRequest();
const url = 'http://localhost:8888/';
xhr.responseType = 'json';
xhr.onreadystatechange = () => {
log("Ready state: " + xhr.readyState + ", response: " + xhr.response);
if(xhr.readyState === XMLHttpRequest.DONE) {
return xhr.response;
}
};
xhr.open('GET', url);
xhr.send();
}和server.js
const express = require('express');
const app = express();
const port = 8888;
let requestCount = 1;
app.get('/', (req, res, next) => {
console.log('Received get request ' + requestCount);
++requestCount;
res.send(JSON.stringify({myKey: 'myValue'}));
});
app.listen(port);回答 1
Stack Overflow用户
回答已采纳
发布于 2018-06-10 06:06:40
主要问题是express没有启用CORS (跨域资源共享)，chrome对CORS有点严格。
将以下代码放在app.get之前以启用cross-origin resource sharing
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();
});完整的server.js应如下所示
var express = require("express");
var app = express();
const port = 8888;
let requestCount = 1;
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();
});
app.get('/', (req, res, next) => {
console.log('Received get request ' + requestCount);
++requestCount;
res.send(JSON.stringify({myKey: 'myValue'}));
});
app.listen(port);然后检查开发人员工具的网络选项卡，您应该会看到响应中的{"myKey":"myValue"}。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50778178
复制相关文章
相似问题