Question

我正在尝试将请求从一个localhost端口发送到另一个端口。我在前端使用 angularjs和后端的节点。

由于它是 CORS 请求，在node.js中，我正在使用

res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, PATCH');
res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization');

并在angular.js服务文件中，我正在使用

return {
    getValues: $resource(endpoint + '/admin/getvalues', null, {
        'get': {
             method: 'GET',
             headers:{'Authorization':'Bearer'+' '+ $localStorage.token}
             }
     }),
}

我收到以下错误

请求标头字段预检响应中的Access-Control-Allow-Headers不允许授权。

请帮忙！

Answer 1

您还必须在允许的标头中添加选项。浏览器在发送原始请求之前发送预检请求。见下文

 res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,PATCH,OPTIONS');

来自来源https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/OPTIONS

在CORS中，发送带有OPTIONS方法的预检请求，以便服务器可以响应是否可以使用这些参数发送请求。 Access-Control-Request-Method标头作为预检请求的一部分通知服务器，当发送实际请求时，它将使用POST请求方法发送。 Access-Control-Request-Headers标头通知服务器，在发送实际请求时，它将与X-PINGOTHER和Content-Type个自定义标头一起发送。服务器现在有机会确定是否希望在这种情况下接受请求。

<强> EDITED

您可以使用npmjs.com/package/cors npm package避免此手动配置。我也使用了这种方法，它很简单。

Answer 2

这是一个API问题，如果使用Postman / Fielder向API发送HTTP请求，您将不会收到此错误。对于浏览器，出于安全目的，他们总是在发送实际请求（GET / POST / PUT / DELETE）之前向API发送OPTIONS请求/预检。因此，如果请求方法是OPTION，您不仅需要添加＆＃34;授权＆＃34;进入＆＃34;访问控制允许标题＆＃34;，但您需要添加＆＃34; OPTIONS＆＃34;进入＆＃34;访问控制允许方法＆＃34;同样。这是我修复的方式：

{{1}}

Answer 3

res.header('Access-Control-Allow-Origin', '*');不能与Autorization标头一起使用。只需使用cors library启用飞行前请求：

var express = require('express')
var cors = require('cors')
var app = express()
app.use(cors())
app.options('*', cors())

Answer 4

对于任何使用ServiceStack后端获取此信息的人；在“ Cors plugin”中允许的标题中添加“授权”：

Plugins.Add(new CorsFeature(allowedHeaders: "Content-Type,Authorization"));

Answer 5

如果您不想安装cors库而是想修复原始代码，那么您缺少的另一个步骤是Access-Control-Allow-Origin：*是错误的。传递身份验证令牌（例如JWT）时，您必须明确说明每个调用您服务器的URL。执行身份验证令牌时不能使用“*”。

Answer 6

首先，您需要安装 cors，方法是使用以下命令：

npm install cors --save

现在将以下代码添加到您的应用起始文件中，例如（app.js or server.js

var express = require('express');
var app = express();

var cors = require('cors');
var bodyParser = require('body-parser');

//enables cors
app.use(cors({
  'allowedHeaders': ['sessionId', 'Content-Type'],
  'exposedHeaders': ['sessionId'],
  'origin': '*',
  'methods': 'GET,HEAD,PUT,PATCH,POST,DELETE',
  'preflightContinue': false
}));

require('./router/index')(app);

Answer 7

添加这个 chrome 扩展 cors unblock 并启用“启用访问控制-[允许/公开]-标题”。
同时在同一菜单中打开 Test cors 并测试所有可用选项。点击每个选项，确保您收到每个选项的成功消息（绿色）。
重新加载您的应用程序。 Cors 错误现已消失。

CORS错误：请求标头字段预检响应

7 个答案: