用promise封装ajax
程序员文章站
2023-12-01 23:45:28
首先贴代码 注释: 1,open(method, url, async) method: GET和POST; url: 发送到服务端的url; async: 异步true,同步false; 2,onreadystatechange 每当readyState的值变化,onreadystatechang ......
首先贴代码
1 var ajaxoptions = { 2 url: 'url', 3 method: 'get', 4 async: true, 5 data: null, 6 datatype: 'text', 7 } 8 9 function ajax(protooptions) { 10 var options = {}; 11 12 for(var i in ajaxoptions){ 13 options[i] = protooptions[i] || ajaxoptions[i]; 14 } 15 16 17 return new promise(function(resolve, reject){ 18 var xhr = new xmlhttprequest(); 19 20 xhr.open(options.method, options.url, options.async); 21 22 xhr.onreadystatechange = function() { 23 if (this.readystate === 4 && this.status === 200) { 24 resolve(this.responsetext, this); 25 } else { 26 var resjson = { 27 code: this.status, 28 response: this.response 29 } 30 reject(resjson, this) 31 } 32 } 33 34 xhr.send() 35 36 }) 37 }
注释:
1,open(method, url, async)
method: get和post;
url: 发送到服务端的url;
async: 异步true,同步false;
2,onreadystatechange
每当readystate的值变化,onreadystatechange函数自动执行
3,readystate 服务器响应的状态信息
- 0: 请求未初始化
- 1: 服务器连接已建立
- 2: 请求已接收
- 3: 请求处理中
- 4: 请求已完成,且响应已就绪
当readystate的值为4,status状态为200时表示相应已就绪,可以执行成功调用的方法,反之调用失败调用的方法
上一篇: PHP编写RESTful接口的方法