《axios怎么兼容ie》

在使用 axios 进行网络请求时，如果要兼容 IE 浏览器，可以采用以下解决方案：通过引入 polyfill 和对 axios 配置进行适当调整来实现兼容。

一、引入 polyfill

很多现代 JavaScript 特性在 IE 中不被支持，而 polyfill 可以弥补这些缺陷。例如，Promise 在 IE 中是不存在的，但 axios 的很多用法都依赖于 Promise。我们可以在项目入口文件（如 main.js）中添加以下代码：

javascript
// 引入babel polyfill
import 'babel-polyfill';


或者直接在 html 文件中通过 script 标签引入：

html</p>



<p>

二、修改 axios 请求头

有时候 IE 对请求头有特殊要求。我们可以设置 axios 默认配置：

javascript
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';


这样可以避免一些由于请求头格式问题导致的 ie 兼容性错误。

三、处理 xhr 对象

IE 下的 xhr 对象与现代浏览器存在差异。可以重写 axios 的适配器来兼容 ie。创建一个自定义适配器文件，例如 adapter.js：

javascript
const customAdapter = (config) => {
    return new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest();
        // 处理 ie 情况下的一些特殊设置
        if (window.XDomainRequest && !/MSIE (d+.d+);/.test(navigator.userAgent)) { // 判断是否为 ie 并且不是 ie10+
            xhr = new XDomainRequest(); // ie8、ie9 跨域使用 XDomainRequest
        }
        xhr.open(config.method.toUpperCase(), config.url, true);
        Object.keys(config.headers).forEach(name => {
            xhr.setRequestHeader(name, config.headers[name]);
        });
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4) {
                if (xhr.status >= 200 && xhr.status < 300) {
                    resolve({
                        data: xhr.responseText,
                        status: xhr.status,
                        statusText: xhr.statusText,
                        headers: parseHeaders(xhr.getAllResponseHeaders()),
                        config: config
                    });
                } else {
                    reject({
                        request: xhr,
                        message: xhr.statusText || 'Error',
                        config: config
                    });
                }
            }
        };
        xhr.onerror = function () {
            reject({
                request: xhr,
                message: 'Network Error',
                config: config
            });
        };
        xhr.send(config.data);
    });
};</p>

<p>function parseHeaders(rawHeaders) {
    let headers = {};
    if (!rawHeaders) {
        return headers;
    }
    rawHeaders.split('rn').forEach(function(line) {
        let parts = line.split(': ');
        headers[parts.shift().trim()] = parts.join(': ').trim();
    });
    return headers;
}

然后在 axios 实例创建时指定这个适配器：

javascript
import axios from 'axios';
import customAdapter from './adapter';</p>

<p>const instance = axios.create({
    adapter: customAdapter
});

通过以上多种思路和方法的综合运用，可以较好地使 axios 兼容 ie 浏览器，在项目开发过程中根据实际需求选择合适的方式进行处理。