请求标头字段不允许授权(AngularJS rest api 请求)

Question

我有用AngularJS编写的应用程序。我想访问 FlightAware API。我使用以下代码：

let Client = require('node-rest-client').Client;
let username = 'x';
let apiKey = 'y';
let fxmlUrl = 'https://flightxml.flightaware.com/json/FlightXML3/'
let client_options = {
user: username,
password: apiKey
}
let client = new Client(client_options);
client.registerMethod('findFlights', fxmlUrl + 'FindFlight', 'GET');
client.registerMethod('weatherConditions', fxmlUrl + 'WeatherConditions', 'GET');
let findFlightArgs = {
parameters: {
origin: 'KIAH',
destination: 'KJFK',
type: 'nonstop'
}
}
let weatherConditionsArgs = {
parameters: {
airport_code: 'KHOU'
}
}
client.methods.weatherConditions(weatherConditionsArgs, function (data, response) {
console.log('Current conditions at Hobby Airport: %j', data.WeatherConditionsResult.conditions[0]);
})

当我在nodeJS中执行它时，它可以工作，但是在我的AngularJS应用程序中，我收到一个错误：Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response.

我发现一些信息表明此错误与 CORS 有关，但无论我使用 AngularJS 还是 NodeJS 来运行代码，服务器端都是相同的。如何在 AngularJS 中执行它而不会出错？

Answer 1

错误消息指出，FlightXML 服务器 (https://flightxml.flightaware.com) 未设置相应的 CORS 标头，这是从浏览器运行所必需的。(如果从 http://yoursite.com 运行的浏览器应用程序从另一台主机(例如 https://flightxml.flightaware.com)获取数据，则 CORS 为"打开")

CORS 限制仅适用于在浏览器中运行的应用程序。因此，在 NodeJS(服务器端)上运行的"相同"JavaScript 代码不会有这样的限制。

不幸的是，外部服务器必须设置Access-Control-Allow-Headers: Authorization标头，否则基于浏览器的方案将不起作用。所以看起来 FlightXML 不支持您的方案。

作为修复，我建议您创建一个服务器端代理，因此

1. 您的浏览器端代码不会直接从 flightXML 读取数据，而是调用您自己的服务器的某些 HTTP 端点，例如http://yoursite.com/weather?args...。
2. 您的服务器代码连接到 FlightXML(无 CORS 限制)并简单地返回所需的数据