直接上代码:

 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. mysql初识笔记

    一.初始mysql mysql介绍: mysql版本: 版本号=3个数字+1个后缀 mysql-5.0.9-beta 5 0 9 Beta 主版本号 发行级别 发行稳定级别 发行系列 发行系列的版本号 ...

  2. 博客的第一天:回顾半年前的基础:SQL--基础查询+年月日格式+拼接

    ----------------------2019/6月份 <<必知必会>>书本练习-实践练习--------------------------- ---order by没 ...

  3. win10安装python

    下载地址:https://www.python.org/downloads/release/python-365/ 安装完成后,在cmd里输入  python ,检查是否安装成功

  4. .Net Core删除ClientApp目录,重新生成报错解决办法

    因为在老的项目上做修改,需要删除单独的spa目录,就把ClientApp删掉了.但是重新生成报错,在VS2017界面上也没找到在什么地方配置.最后发现在csproj上里面可以去掉spa的配置 < ...

  5. 03-01 K-Means聚类算法

    目录 K-Means聚类算法 一.K-Means聚类算法学习目标 二.K-Means聚类算法详解 2.1 K-Means聚类算法原理 2.2 K-Means聚类算法和KNN 三.传统的K-Means聚 ...

  6. 前端css杂记

    1em等于16px,页面默认是16px,一个字宽高都等于16px; 当行内元素display:inline的元素设置float:left浮动后,display值也被设置成block;总结:无论行内元素 ...

  7. JS里面的铠甲合体!

    本标题党又回来了,最近在专心研究一些JS基础性的书籍,以期把原理都了解透彻,所以写文章的频率就降了下来.但是今天我必须要来写一下子,为什么呢,因为今天周五!先说明一下JS里面的拆箱与装箱指的是JS封箱 ...

  8. Windows API 编程入门

    Windows 工作原理的中心思想就是“动态链接”概念.Windows 自身带有一大套函数,应用程序就是通过调用这些函数 来实现它的用户界面和在屏幕上显示文本和图形的.这些函数都是在动态链接库里实现的 ...

  9. vi/vim编辑器使用方法详解

    vi编辑器是所有Unix及Linux系统下标准的编辑器,他就相当于windows系统中的记事本一样,它的强大不逊色于任何最新的文本编辑器.他是我们使用Linux系统不能缺少的工具.由于对Unix及li ...

  10. Hadoop和YARN :map+shuffle+reduce走读

    今天做了一个hadoop分享,总结下来,包括mapreduce,及shuffle深度讲解,还有YARN框架的详细说明等. v\:* {behavior:url(#default#VML);} o\:* ...