来源: https://www.cnblogs.com/leaf930814/p/6807318.html

-------------------------------------------------------

一、简介

看看官网的简介:

“Promise based HTTP client for the browser and node.js”

译:基于 Promise 的 HTTP 请求客户端,可同时在浏览器和 node.js 中使用。

二、特点:

1、在浏览器中发送 XMLHttpRequests 请求;
2、在 node.js 中发送 http请求;
3、支持 Promise API;
4、拦截请求和响应;
5、转换请求和响应数据;
6、自动转换 JSON 数据;
7、客户端支持保护安全免受 XSRF 攻击;

三、安装(官网)

四、应用

1、发送一个get请求


axios.get('/welfare', {
  params: {
  giftPackId: 1
  }
 })
 .then(function(res) {
  console.log(res);
 })
 .catch(function (res) {
  console.log(res);
 });

2、发送一个post请求

1
2
3
4
5
6
7
8
9
axios.post('/welfare', {
     giftPackId: 1
  })
  .then(function (res) {
    console.log(res);
  })
  .catch(function (res) {
    console.log(res);
  });

3、发送多个并发请求

1
2
3
4
5
6
7
8
9
10
11
12
function getUserAccount() {
  return axios.get('/welfare');
}
 
function getUserPermissions() {
  return axios.get('/getWelfare');
}
 
axios.all([getUserAccount(), getUserPermissions()])
  .then(axios.spread(function (acct, perms) {
    // ok
  }));

4、除此之外axios还提供还有如下几种请求方式:

1
2
3
4
5
6
7
8
9
10
11
12
13
axios.request(config)
 
axios.get(url[, config])
 
axios.delete(url[, config])
 
axios.head(url[, config])
 
axios.post(url[, data[, config]])
 
axios.put(url[, data[, config]])
 
axios.patch(url[, data[, config]])

5、兼容性处理

项目中发现,在安卓4.3及以下的手机不支持axios的使用,主要就是无法使用promise。加上以下polyfill就可以了。

项目中安装es6-promise

1
cnpm install es6-promise --save-dev

在axios.min.js开头加上

1
require('es6-promise').polyfill();

ok! 

[转]axios的兼容性处理的更多相关文章

  1. axios的兼容性

    axios的兼容性处理   一.简介 看看官网的简介: “Promise based HTTP client for the browser and node.js” 译:基于 Promise 的 H ...

  2. axios的兼容性处理

    一.简介 看看官网的简介: "Promise based HTTP client for the browser and node.js" 译:基于 Promise 的 HTTP ...

  3. 除了使用URLSearchParams处理axios发送的数据,但是兼容性不好,其他的兼容方法

    在使用axios这个ajax插件的时候,我们有些时候会遇到一些问题,比如:数据格式不正确 以最简单的例子为基础(这里使用post方法): 在上面的例子中我们直接调用axios的post方法,传给后台的 ...

  4. nuxtJs - axios 的 IE 兼容性的问题

    因为考虑SEO, 所以采用nuxt.js进行服务端渲染, 用熟了vue, nuxt无缝对接简直不要太爽 烦人的需求又来了, 要兼容IE ~~ 兼容处理 无非就是babel 将高级语法转成弱智IE看得懂 ...

  5. axios 安卓低版本兼容性处理

    问题: 在较低版本的android手机中发现封装的 http 无效,我测试使用的是android 4.4的老手机,主要就是无法使用promise. 解决方案 安装 npm install es6-pr ...

  6. 使用axios对安卓或者ios低版本兼容性处理

    原因:不支持ES6,无法使用promise 解决办法: 1.安装 es6-promise cnpm install es6-promise --save-dev 2.引入 es6-promise im ...

  7. axios全攻略

    随着 vuejs 作者尤雨溪发布消息,不再继续维护vue-resource,并推荐大家使用 axios 开始,axios 被越来越多的人所了解.本来想在网上找找详细攻略,突然发现,axios 的官方文 ...

  8. vue-resource promise兼容性问题

    背景 其实这个问题在之前的项目开发中就出现过,但是当初只解决问题了,并没有针对问题作总结:于是乎今天踩到了自己埋的坑,所以决定记录一下.那么到底是什么问题呢?就是"在安卓低版本,如果你在vu ...

  9. 前端MVC Vue2学习总结(六)——axios与跨域HTTP请求、Lodash工具库

    一.axios Vue更新到2.0之后宣告不再对vue-resource更新,推荐使用axios,axios是一个用于客户端与服务器通信的组件,axios 是一个基于Promise 用于浏览器和 no ...

随机推荐

  1. poj3373--Changing Digits(DFS+剪枝///记忆化)

    题目链接:点击打开链接 题目大意:给出一个n和一个k 求m 要求1.m要和n相同的位数 要求2.m要整除k 要求3.如果1和2满足,那么m要和n有尽量少的不同位 要求4.如果1.2.3满足,要使m尽量 ...

  2. phpStudy环境安装SSL证书教程

    第一步:修改apache目录下的httpd.conf配置文件(D:\phpStudy\PHPTutorial\Apache\conf\ ) #LoadModule ssl_module modules ...

  3. CCF CSP 201403-1 相反数

    题目链接:http://118.190.20.162/view.page?gpid=T10 问题描述 试题编号: 201403-1 试题名称: 相反数 时间限制: 1.0s 内存限制: 256.0MB ...

  4. 叮咚,你的Lauce上线了!

    哈,2014 - 2016 - 2018,虽然每隔两年才有那么一篇随笔,博客园,我还是爱你的~ 嗯,2018,马上又要失业了,我这是自带黑属性啊啊啊哈,工作了4年多的项目要被砍掉了, 倒不是说非要这个 ...

  5. psutil的几个例子

    python进行系统相关操作时都有点力不从心,尤其是windows下,比如获取进程的cpu.内存等等,可以通过以下方法可以达到这种要求: 1.安装pywin32.psutil这种第三方库,里面提供了很 ...

  6. redis哨兵集群配置

    redis 集群架构图: 需要先配置redis主从,我这边是单机部署的. 采用一主一从,两个sentinel. redis host: 172.31.11.235 redis-master port: ...

  7. [Python]基础教程(4)、Python 变量类型

    Python 变量类型 变量存储在内存中的值.这就意味着在创建变量时会在内存中开辟一个空间. 基于变量的数据类型,解释器会分配指定内存,并决定什么数据可以被存储在内存中. 因此,变量可以指定不同的数据 ...

  8. Spring cloud Greenwich Eureka

    1.父工程POM文件中: <dependencyManagement> <dependencies> <!--spring cloud--> <depende ...

  9. main函数的的两个参数

    C语言中main函数的参数有两个,这两个参数写为argc和argv.因此,main函数的函数头可写为:main(argc,argv);C语言还规定argc(第一个形参)必须是整型变量,argv( 第二 ...

  10. 王之泰/王志成《面向对象程序设计(java)》第十一周学习总结

    第一部分:理论知识学习部分 第十一章理论知识主要为集合类的介绍,在实验中都有所体现且本周主要复习回顾上周的泛型程序设计 第二部分:实验部分 ——集合 1.实验目的与要求 (1) 掌握Vetor.Sta ...