原生ajax写法

ajax1.0，ie9及以下，ie10+支持ajax2.0

ajax2.0比ajax1.0:

1.多了FormData对象，xhr.send(formData)  //不能用GET

2.文件上传,文件上传进度 //把<input type="file" />对象set入formData，xhr.upload.onprogress=ev=>{ev.loaded/evtotal}

3.CORS跨域双验证 // 请求头多了ORIGIN，响应头带上"Access-Control-Allow-Origin"

1.0写法，分四步：

1.创建xhr对象

let xhr = new XMLHttpRequest();

2. 设置超时时间（毫秒）

// 2s超时
xhr.timeout = 2000;

3.建立连接

// 方法 URL 是否异步
xhr.open('GET','http://www.qq.com',true);

4.设置http头

//可以设置某些http头信息
xhr.setRequestHeader('Expires', 'Mon, 20 Jul 2029 23:00:00 GMT')
//甚至是一些自定义的头部
xhr.setRequestHeader('amie', 'xxxxxxx')
//但是诸如User-Agent、Referer浏览器是禁止设置的

5.发送请求

//send可以send任意数据类型
xhr.send('内容');

6.接收响应

xhr.onreadystatechange= ()=>{
     if(xhr.readyState == 4){
        //请求完成了
        if((xhr.status>=200&&xhr.status<300)||xhr.status==304){
            //请求成功了,拿到返回的数据
            var data = xhr.responseText;
        }
    }
}

7.超时和错误事件

xhr.ontimeout = xhr.onerror = err => {
    this.$fui.popup({
        message: '连通性测试失败',
        type: 'error',
    });
    this.loading = false;
};