Javascript/JQuery 在 OPTIONS Preflight API 中发送自定义标头答案

【问题标题】：Javascript/JQuery Send custom header in OPTIONS Preflight APIJavascript/JQuery 在 OPTIONS Preflight API 中发送自定义标头
【发布时间】：2017-01-07 21:17:18
【问题描述】：

代码转储：

$.ajax({
   type: 'GET',
   dataType: 'json',
   url: api,
   xhrFields: {
     withCredentials: true
   },
   beforeSend: function (xhr) {
     xhr.setRequestHeader('Authorization', "Basic [my auth token]");
   },
   success: function(jd) {
      console.log(jd.stringify());
   }
});

问题是，当我包含 beforeSend 时，Chrome 和 Firefox 会发送 OPTIONS 预检，但是 API 拒绝了 OPTIONS 请求，因为它不知道如何处理 OPTIONS 请求并将其视为 GET，没有看到授权标头并拒绝请求。

我可以让它工作的唯一方法是强制浏览器不发送 OPTIONS 请求或包含我的标题。我无法修改我正在使用的 API。

如果有人能给我建议，我将不胜感激。

【问题讨论】：

OPTIONS 请求在跨域请求之前发送，以确保 CORS 标头在响应中到位。首先，您是否打算提出跨域请求？其次，你对接收服务器有控制权吗？
是的，我打算跨域（这是一个 API 请求），不，我无法控制服务器：“我无法修改我正在使用的 API。”
在这种情况下，恐怕您尝试做的事情无法通过 JS 代码实现。 OPTIONS 请求失败，因为响应服务器未设置为在响应中发送 CORS 标头，因此他们不允许来自第三方域的 API 请求。相反，您需要在服务器端进行请求。
如果您检查控制台，您很可能会看到类似于 “No 'Access-Control-Allow-Origin' header is present on the requested resource” 的错误，如果是这样，请查看此问题以了解问题的解释：stackoverflow.com/questions/20035101/…。
我知道 API 旨在处理第 3 方请求，因为这就是它的创建目的！它已通过请求令牌等完整记录

标签： javascript jquery ajax http-headers

【解决方案1】：

浏览器发送预检请求的原因是您使用了自定义标头。请。阅读有关如何避免预检请求的信息（内容类型应为文本或 html，并且没有自定义标题）如果您无法更改服务器端，使其工作的最后机会是创建您的自定义代理（例如，您可以创建节点服务器，该节点应用程序会接受您的请求并将它们转发到那些 Api 然后您甚至将拥有自己的服务器在某个域中，此代理服务器会将 CORS 请求发送到另一个服务器域。

【讨论】：