请求 header 字段 Access-Control-Allow-Origin

Question

上的 expressjs 服务器

app.use(function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
  next();
});

和客户端应用程序 http://localhost:8080 并想 post 将数据发送到服务器。我使用 XMLHttpRequest:

execute(url, requestType, params) {
  return new Promise(
    (resolve, reject) => {
      var request = new XMLHttpRequest();
      request.open(requestType, url, true);
      request.setRequestHeader('Accept', 'application/json');
      request.setRequestHeader('Content-Type', 'application/json');
      request.onload = () => {
       switch (request.status) {
        case 201:
        case 200:
          resolve(request.response);
          break;
        default:
          reject(`${Constants.ERRORS.NETWORK}: ${request.statusText}`);
          break;
       }
   }

   request.onerror = () => {
      reject(Constants.ERRORS.NETWORK);
   };

   params ? request.send(params) : request.send();
  });

};

并且当我使用 execuete("http://localhost:3000/register", "POST", {"some": "data"}) 时，我在预检响应中出现错误 Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers。我该如何解决？

Answer 1

我之前遇到过类似的问题并通过使用

解决了

app.all('/', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
});

或

app.all('*', function(req, res, next) {
      res.header("Access-Control-Allow-Origin", "*");
      res.header("Access-Control-Allow-Headers", "X-Requested-With");
      next();
});

Answer 2

application/json是Content-type请求头的非简单值（见my answer on How does Access-Control-Allow-Origin header work?中"Non-simple request"的开头，所以必须明确允许服务器通过响应头 Access-Control-Allow-Headers: application/json。只需添加行

res.header("Access-Control-Allow-Headers", "application/json");

到您的服务器代码。

请求 header 字段 Access-Control-Allow-Origin

Request header field Access-Control-Allow-Origin

ajax

xmlhttprequest

cors