在Node.js Express.js服务器中添加标头后,Chrome中仍然出现CORS错误

时间:2018-07-03 21:30:01

标签: javascript node.js ajax xml cors

我正在尝试对GET文件执行简单的XML请求,但我陷入了这个CORS错误。

我尝试了多种解决方案,包括在我的server.js文件中手动添加标头,以及使用cors NPM软件包。有了这两个选项,如果我在Postman中点击了端点,则可以看到附加在请求和响应上的标头。

但是,在Google Chrome浏览器中,标头未附加到请求中。这是我的index.html文件中的代码:

<body>
  <h1>test</h1>
  <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
  <!-- <script src="./server.js"></script>  -->
  <script>
    var xhr = new XMLHttpRequest();
    xhr.open('GET', http://11.111.111.111/web/data/data.xml, true);
    xhr.setRequestHeader('Access-Control-Allow-Origin', '*') 
    xhr.withCredentials = true;
    xhr.send(null);
  </script>
</body>

请注意,我已经用占位符替换了我试图从中获取信息的XML页面的URL。

这是我的server.js文件中的代码:

var express = require("express");
var bodyParser = require("body-parser");
var path = require("path");
var cors = require('cors')
// Sets up the Express App
var app = express();

var PORT = 3000;
app.use(cors())
app.options('*', cors()) // include before other routes

// Sets up the Express app to handle data parsing
app.use(bodyParser.urlencoded({
  extended: true
}));
app.use(bodyParser.json());

// Routes
app.get("/test", function(req, res) {
   //res.set({
   // 'Access-Control-Allow-Origin': ['*'],
   // 'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE',
   // 'Access-Control-Allow-Headers': 'Content-Type'
   // });
  res.sendFile(path.join(__dirname, "./index.html"));
  console.log('hit me')
  console.log(res);
});

app.get("/", function(req, res) {
  res.send('Houston, we have a problem.')
});

// Starts the server to begin listening
app.listen(PORT, function() {
  console.log("App listening on PORT " + PORT);
});

这是邮递员输出的屏幕截图 screenshot from dev-tools

我在客户端xhr.setRequestHeader('Access-Control-Allow-Origin', '*')请求中添加了xhr,然后切换为使用cors包。现在我收到此错误:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我按照app.options('*', cors()) // include before other routes文档中的说明添加了npm cors,但是仍然出现相同的错误。但是,标头已附加到开发工具中的请求中。我已经更新了这篇文章的代码和屏幕截图,以反映这些更改。

dev-tools中的屏幕截图:
screenshot from dev-tools

2 个答案:

答案 0 :(得分:0)

最终从该团队得到回音,事实证明服务器已配置为阻止所有cors请求。

答案 1 :(得分:-1)

如果仅用于本地测试,请尝试以下操作:https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi 或尝试使用此https://www.npmjs.com/package/cors

从“ cors”导入cors

app.use(cors())