XMLHttpRequest (XHR) 浏览器兼容性详解

核心兼容性列表

1. 基础支持情况

浏览器/版本	支持情况	特殊限制
IE6/IE7	不支持原生XHR，需使用ActiveXObject("Microsoft.XMLHTTP")	仅同步请求
IE8/IE9	完全不支持XHR对象	-
IE10/IE11	部分支持	不支持xhr.responseType为json
Chrome/Firefox/Safari/Edge	完全支持	-
Opera Mini	完全不支持	-

2. 高级特性支持

特性	兼容情况	受影响浏览器
responseType=json	部分支持	IE10/IE11不支持
responseType=blob	部分支持	旧版移动浏览器可能不支持
timeout属性	部分支持	某些旧版浏览器不支持
upload属性	现代浏览器支持	IE9及以下不支持
CORS跨域请求	需服务器配合	所有浏览器需配置Access-Control-Allow-Origin

3. 事件支持差异

事件类型	兼容性	备注
onreadystatechange	全支持	基础事件
onprogress/upload.onprogress	IE10+	旧IE不支持
ontimeout	部分支持	依赖timeout属性支持
onerror	全支持	实现细节可能不同
onload/onloadend	IE9+	更现代的替代方案

兼容性解决方案

1. 创建兼容的XHR对象

function createXHR() {
  if (window.XMLHttpRequest) {
    return new XMLHttpRequest(); // 标准浏览器
  }
  try {
    return new ActiveXObject("Msxml2.XMLHTTP"); // IE6+
  } catch(e) {
    try {
      return new ActiveXObject("Microsoft.XMLHTTP"); // IE5
    } catch(e) {
      throw new Error("浏览器不支持XHR");
    }
  }
}:ml-citation{ref="7" data="citationList"}

2. 特性检测方案

// 检测超时支持
const supportsTimeout = 'timeout' in new XMLHttpRequest();
// 检测responseType支持
const xhr = new XMLHttpRequest();
xhr.responseType = 'json';
const supportsJSON = xhr.responseType === 'json';:ml-citation{ref="9" data="citationList"}

现代浏览器注意事项

1. ‌CORS限制‌：所有现代浏览器严格执行同源策略，跨域请求需服务器设置Access-Control-Allow-Origin

2. ‌HTTPS要求‌：现代浏览器对混合内容(XHR从HTTPS页面向HTTP地址请求)会阻止或警告

3. ‌隐私限制‌：Safari等浏览器对第三方cookie的限制会影响withCredentials的使用

推荐替代方案

1. ‌Fetch API‌：更现代的替代方案，但IE完全不支持

2. ‌Axios‌：基于XHR的封装，处理了大部分兼容性问题

3. ‌jQuery.ajax‌：兼容旧浏览器的封装方案

移动端特殊考虑

1. ‌iOS Safari‌：对并发请求数有限制(同一域名最多6个)

2. ‌Android WebView‌：可能禁用XHR，需特殊配置

3. ‌省电模式‌：可能限制后台XHR请求