CORS错误：请求标题字段在飞行前响应中不允许Access-Control-Allow-Headers进行授权

Question

我正在尝试将请求从一个本地主机端口发送到另一个本地主机端口。我 在前端 使用 angularjs，在后端 使用 node 。

由于这是 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自定义首部。服务器现在有机会确定在这种情况下是否希望接受请求。

已编辑

您可以通过使用npmjs.com/package/cors npm package
来避免这种手动配置。我也使用了这种方法，它既简单又清晰。