JQuery Ajax在IE正常运行，Chrome中OPTIONS请求失败问题咨询

兄弟，你这个问题我之前踩过坑！首先得揪出一个关键误区：你在前端请求里加的Access-Control-Allow-Origin、Access-Control-Allow-Methods这些头，完全不该出现在请求里！这些是服务器端要返回的响应头，前端加了不仅没用，反而可能干扰正常流程。

为啥Chrome会报OPTIONS请求失败？这是因为你的请求触发了CORS的预检请求：当请求带自定义头（比如你加的Authorization），或者不符合“简单请求”条件时，Chrome会自动先发一个OPTIONS请求给服务器，确认对方是否允许这个跨域请求。而IE的CORS实现比较特殊（比如旧版本用XDomainRequest），可能没触发预检，所以之前能正常跑。

下面是具体的解决步骤：

1. 服务器端必须正确处理OPTIONS请求 #

这是核心！你得在服务器端配置CORS，对OPTIONS请求返回正确的响应头：

• 返回 Access-Control-Allow-Origin: *（如果想更安全，可以指定你的前端域名，比如http://your-frontend.com）
• 返回 Access-Control-Allow-Methods: GET, OPTIONS（匹配你的请求方法）
• 返回 Access-Control-Allow-Headers: Authorization（必须明确允许你用的Authorization头）
• 可选：返回 Access-Control-Max-Age: 86400，让浏览器缓存预检结果一天，减少重复OPTIONS请求

举个Node.js/Express的配置例子，用cors中间件就能快速搞定：

const cors = require('cors');
app.use(cors({
  origin: '*', // 替换成你的前端域名更安全
  methods: ['GET', 'OPTIONS'],
  allowedHeaders: ['Authorization']
}));

2. 前端代码调整 #

把多余的请求头删掉，保留必要的部分就行，正确代码应该是这样：

$.ajax({
  beforeSend: function (xhr) {
    // 只保留Authorization头，这才是你需要的
    xhr.setRequestHeader("Authorization", "Basic " + btoa("user" + ":" + "password"));
  },
  url: 'http://someurl/',
  type: 'GET',
  contentType: 'text/html',
  success: function(response) {
    // 处理返回内容
    console.log(response);
  },
  error: function(xhr, status, err) {
    console.error('请求失败:', err);
  }
});

额外唠两句 #

为啥IE能正常运行？因为旧版IE的CORS实现（XDomainRequest）不支持自定义头的预检，对跨域限制更宽松，但Chrome严格遵循W3C的CORS标准，所以必须处理OPTIONS请求。只要服务器端配置到位，Chrome的问题立马就能解决。

内容的提问来源于stack exchange，提问作者Prasad