axios可以通过npm安装的服务(在vue项目中很好使用).txt

一、安装

1、用npm安装npm install axios --save
2、直接利用cdn引入

二、例子：

1、 发送一个GET请求

//通过给定的ID来发送请求
axios.get('/user?ID=12345')
  .then(function(response){
    console.log(response);
  })
  .catch(function(err){
    console.log(err);
  });
//以上请求也可以通过这种方式来发送
axios.get('/user',{
  params:{
    ID:12345
  }
})
.then(function(response){
  console.log(response);
})
.catch(function(err){
  console.log(err);
});

2.发送一个POST请求

axios.post('/user',{
  firstName:'Fred',
  lastName:'Flintstone'
})
.then(function(res){
  console.log(res);
})
.catch(function(err){
  console.log(err);
});

3.一次性并发多个请求

function getUserAccount(){
  return axios.get('/user/12345');
}
function getUserPermissions(){
  return axios.get('/user/12345/permissions');
}
axios.all([getUserAccount(),getUserPermissions()])
  .then(axios.spread(function(acct,perms){
    //当这两个请求都完成的时候会触发这个函数，两个参数分别代表返回的结果
  }))

三、axios的api
 1.axios可以通过配置（config）来发送请求
 axios({
    method:"POST",
    url:'/user/12345',
    data:{
        firstName:"Fred",
        lastName:"Flintstone"
    }
});

参考地址：http://www.jianshu.com/p/df464b26ae58

axios使用post的默认请求头"application/json; charset=UTF-8"
如果修改项目的时候需要使用"application/x-www-form-urlencoded; charset=UTF-8"的时候

  axios.post('/api/mobile/exchangegift',
  qs.stringify({
    exchangeid:id,
    count:count
  }),{
    headers: {
      "Content-Type":
        "application/x-www-form-urlencoded; charset=UTF-8"
    }
  })
  .then((res) => {
    console.log(res);
  })
  .catch(function(err){
    console.log(err);
  });

附加：
qs.stringify() 和JSON.stringify()有什么区别

功能虽然都是序列化，但是序列化出来的结果完全不同

var a = {name:'hehe',age:10};

qs.stringify序列化结果如下

name=hehe&age=10;

而JSON.stringify序列化结果如下：

"{"a":"hehe","age":10}";

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

项目中安装es6-promise

cnpm install es6-promise --save-dev

在axios.min.js开头加上（需要在node_modules中找axios文件夹的dist中找）

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

注意：这样做需要注意每次npm i 的时候都需要重新添加这句代码
你也可以在使用页面的入口部分添加（这样就可以不免上述问题）