直接上代码:

 function Ajax(method, headers, url, data, progress = null) {
return new Promise(function (resolve, reject) {
let xhr = new XMLHttpRequest();   
xhr.open(method,url);//配置
for (const key in headers) {//遍历header,设置响应头
let value = headers[key];
xhr.setRequestHeader(key,value);
}
xhr.send(data);//发送,并配置响应体
xhr.onreadystatechange = function () {
if (xhr.readyState === ) {
try {//设置了超时时间, 防止由于该条件(即readystate等于4)成立, 进入该判断块, 下面的status读取不到, 导致抛出错误
if (xhr.status >= || xhr.status < || xhr.status == ) {
resolve(xhr.responseText);
} else {
reject(new Error(xhr.statusText));
}
} catch (error) {
reject(new Error('服务器错误请重试'));
}
}
};
});
}

使用promise封装ajax的更多相关文章

  1. Promise 封装 ajax

    Promise 封装ajax 成链式结构: var url = 'http'; function(method, url) { return new Promise(function(res, ret ...

  2. 用promise封装ajax

    首先贴代码 var ajaxOptions = { url: 'url', method: 'GET', async: true, data: null, dataType: 'text', } fu ...

  3. promise封装ajax

    promise的含义(本身不是异步,是封装异步操作的容器,统一异步的标准) promise对象的特点:对象的状态不受外界影响:一旦状态改变,就不会再变,任何时候都可以得到这个结果. function ...

  4. vue实践---vue结合 promise 封装原生ajax

    有时候不想使用axios这样的外部依赖,想自己封装ajax,这里有两种方法 方法一,在单个页面内使用 封装的代码如下: beforeCreate () { this.$http = (() => ...

  5. 简单的基于promise的ajax封装

    基于promise的ajax封装 //调用方式: /* ajaxPrmomise({ url:, method:, headers:{} }).then(res=>{}) */ ;(functi ...

  6. React Native 网络请求封装:使用Promise封装fetch请求

    最近公司使用React作为前端框架,使用了异步请求访问,这里做下总结: React Native中虽然也内置了XMLHttpRequest 网络请求API(也就是俗称的ajax),但XMLHttpRe ...

  7. 微信小程序ES6方法Promise封装接口

    为何要封装接口? 有小程序开发的经验者,相信对微信API Request很熟悉了.对接接口时,有大部分的开发者都是直接调用request方法,去请求后台接口并渲染数据.诚然,直接使用api发起请求对接 ...

  8. jsonp的原理介绍及Promise封装

    什么叫jsonp? jsonp是json with padding(填充式json或参数式json)的简写,是通过ajax请求跨域接口,获取数据的新实现方式 jsonp的实现原理: 动态创建scrip ...

  9. vue axios接口封装、Promise封装、简单的axios方法封装、vue接口方法封装、vue post、get、patch、put方法封装

    相信大家在做前后端数据交互的时候都会给请求做一些简单的封装就像之前封装ajax方法一样axios的封装也是一样的简单下面这个就是封装的axios的方法,require.js import axios ...

随机推荐

  1. hadoop入门之海量Web日志分析 用Hadoop提取KPI统计指标

    转载自:http://blog.fens.me/hadoop-mapreduce-log-kpi/ 今天学习了这一篇博客,写得十分好,照着这篇博客敲了一遍. 发现几个问题, 一是这篇博客中采用的had ...

  2. java跬步积累

    1.eclipse自动生成get/set方法快捷键 alt+shift+s +r 2.eclipse自动生成等号左边快捷键 将光标移到:号右边,然后按Ctrl+1 3.补全代码快捷键 Alt+/ 4. ...

  3. ELK系列(一):安装(elasticsearch + logstash + kibana)

    因为公司使用ELK的缘故,这两天尝试在阿里云上安装了下ELK,这里做个笔记,有兴趣的同学可以看下. 先大致介绍下ELK,ELK是三个组件的缩写,分别是elasticsearch.logstash.ki ...

  4. MySQL中日期和时间戳互相转换的函数和方法

     时间戳转换成日期 复制代码代码如下: FROM_UNIXTIME 例如: 数据表中 invest_time 存储的是时间戳,如 1429063399 使用 FROM_UNIXTIME 可以把时间戳转 ...

  5. HBase学习与实践

    Photo by bealach verse on Unsplash 参考书籍:<HBase 权威指南> -- Lars George著. 文章为个人从零开始学习记录,如有错误,还请不吝赐 ...

  6. [JavaScript] 《JavaScript高级程序设计》笔记

    1.||   和 && 这两个逻辑运算符和c#是类似的,都是惰性的计算 a() || b()  若a()为真返回a()的结果,此时b()不计算: a()为假则返回b() a() &am ...

  7. 在线影视平台人人影视 v3.2.1 绿色便携版

    人人影视是一款可以方便观看美剧和国外大片的视频播放软件,支持在线观看.网盘转存.离线缓存.所有客户端离线下载均加密传输,不用担心任何安全问题.全程加密的 P2P 传输,让热门资源下载更快,海外党不再惧 ...

  8. STM32进阶之串口环形缓冲区实现

    队列的概念 在此之前,我们来回顾一下队列的基本概念: 队列 (Queue):是一种先进先出(First In First Out ,简称 FIFO)的线性表,只允许在一端插入(入队),在另一端进行删除 ...

  9. .NET GC垃圾回收器

    GC垃圾回收器简介 全名: Garbage Collector 原理: 以应用程序的根(root)为基础,遍历应用程序堆(heap)上动态分配的所有对象,通过识别它们是否被引用来确定哪些对象是已经死亡 ...

  10. Java内存模型总结

    Java内存模型 内存模型可以理解为在特定的操作协议下,对特定的内存或者高速缓存进行读写访问的过程抽象,不同架构下的物理机拥有不一样的内存模型,Java虚拟机也有自己的内存模型,即Java内存模型(J ...