摘要：表示應(yīng)該使用基礎(chǔ)驗(yàn)證，并提供數(shù)據(jù)。表示服務(wù)器響應(yīng)的數(shù)據(jù)類型，可以是，，，，，，默認(rèn)值是承載的值的頭的名稱。對(duì)原生進(jìn)度事件的處理定義允許的響應(yīng)內(nèi)容的最大尺寸?；菊J(rèn)證的過(guò)程。后者將優(yōu)先于前者。

Axios是一個(gè)基于promise的HTTP庫(kù)，可以用在瀏覽器和node.js中。

使用npm:

$ npm install axios

使用bower

$ bower install axiso

使用cdn：

執(zhí)行GET請(qǐng)求

//為給定ID的user創(chuàng)建請(qǐng)求
axiso.get("/user?ID=12345").then(
    function(res){
        console.log(res);
        }).catch(function(err){
            console.log(err)
        });
//可選地，上面的請(qǐng)求可以這樣做
axios.get("/user",{
    params:{
        ID:12345,
    }
}).then(
    function(res){
        console.log(res);
    }
).catch(function(err){})
 

執(zhí)行POST請(qǐng)求

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

執(zhí)行多個(gè)并發(fā)請(qǐng)求,.then以后使用axios.spread方法分割請(qǐng)求的數(shù)據(jù)，一一對(duì)應(yīng)。

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){
    //兩個(gè)請(qǐng)求現(xiàn)在都執(zhí)行完成
}))

axios API
可以通過(guò)向axiso傳遞相關(guān)配置來(lái)創(chuàng)建請(qǐng)求
axios(config)
//發(fā)送post請(qǐng)求

axios({
    method:"post",
    url:"/user/12345",
    data:{
        first:1,
        last:2
    }
})

為方便起見(jiàn)，為所有支持的請(qǐng)求方法提供了別名
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]])

創(chuàng)建實(shí)例
axios.create([config])

var instance = axios.create({
    baseUrl:"https://some-domain.com/api/",
    timeout:1000,
    headers:{"X-Custom-Header": "foobar"}
})

實(shí)例方法：
以下是可用的實(shí)例方法。指定的配置將與實(shí)例的配置合并
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]])

請(qǐng)求配置

{
    //url是用于請(qǐng)求服務(wù)器的url
    url:"/user",
    //method是創(chuàng)建請(qǐng)求時(shí)使用的方法
    method:"get",
    //baseUrl將自動(dòng)加在url前面，除非url是一個(gè)絕對(duì)url。
    //它可以通過(guò)設(shè)置一個(gè)baseUrl便于axios實(shí)例的方法傳遞相對(duì)URL
    baseUrl:"https://some-domain.com/api/",
    //transformRequest允許在向服務(wù)器發(fā)送前，修改請(qǐng)求的數(shù)據(jù)。
    //只能用在post，put，patch這幾個(gè)請(qǐng)求方法
    //后面數(shù)組中的函數(shù)必須返回一個(gè)字符串，或ArrayBuffer，或Stream
    transformRequest:[function(data){
       //對(duì)data進(jìn)行任意轉(zhuǎn)換處理。
       return data;
    }],
    //Transform Response在傳遞給then/catch錢，允許修改響應(yīng)的數(shù)據(jù)
    transformResponse：[function(data){
        //對(duì)data進(jìn)行任意轉(zhuǎn)換處理
        return data;
    }],
    //headers是即將被發(fā)送的自定義請(qǐng)求頭
    headers:{"X-Requested-With": "XMLHttpRequest"},
    //params是即將與請(qǐng)求一起發(fā)送的url參數(shù)
    //必須是一個(gè)無(wú)格式對(duì)象plain object或URLSearchParams對(duì)象
    params:{
        ID:12345
    },
    //paramsSerializer是一個(gè)負(fù)責(zé)params序列化的函數(shù)。
    //（e.g.http://www.npmjs.com/package/qs,http://api.jquery.com/jquery.param/）
    paramsSerializer:function(params){
        return Qs.stringfy(params,{arrayFormat:"brackets"})
    },
    //data是作為請(qǐng)求主體被發(fā)送的數(shù)據(jù)
    //只適用與put，post，和patch
    //在沒(méi)有設(shè)置transformRequest時(shí)，必須是以下類型之一：string，plain object，ArrayBuffer，ArrayBufferView，URLSearchParams
    data: {
        firstName: "Fred"
    },
    //timeout指定了請(qǐng)求超時(shí)的毫秒數(shù)，
    //如果請(qǐng)求超過(guò)了timeout的時(shí)間，請(qǐng)求將被中斷，
    timeout:1000,
    //withCredentials表示跨域請(qǐng)求時(shí)是否需要使用憑證，
    withCredentials:false,//默認(rèn)值
    //adapter允許自定義處理請(qǐng)求，以使測(cè)試更輕松，
    //返回一個(gè)promise并應(yīng)用一個(gè)有效的響應(yīng)。
    adapter:function(config){},
    //auth表示應(yīng)該使用http基礎(chǔ)驗(yàn)證，并提供數(shù)據(jù)。
    //這將設(shè)置一個(gè)Authorization頭，覆蓋掉現(xiàn)有的任意使用headers設(shè)置的自定義Authorization頭。
    auth:{
        username:"janedoe",
        password:"s00pers3cret"
    },
    //responseType表示服務(wù)器響應(yīng)的數(shù)據(jù)類型，可以是arraybuffer，blod，document，json，text，stream，
    responseType:json,//默認(rèn)值
    //xsrfHeaderName是承載xsrf token的值的http頭的名稱。
    xsrfHeaderName:"X-XSRF-TOKEN",//默認(rèn)值
    //onUploadProgress允許為上傳處理進(jìn)度事件。
    onUploadProgress：function(progressEvent){
        //對(duì)原生進(jìn)度事件的處理
    },
    //onDownloadProgress允許為下載處理進(jìn)度事件。
    onDownloadProgress:function(){
        //對(duì)原生進(jìn)度事件的處理
    },
    //maxContentLength定義允許的響應(yīng)內(nèi)容的最大尺寸。
    maxContentLength：2000,
    //validateStatus定義與給定的http相應(yīng)狀態(tài)碼是resolve或reject promise。如果validateStatus返回 `true` (或者設(shè)置為 `null` 或 `undefined`)，promise 將被 resolve; 否則，promise 將被 rejecte。
    validateStatus: function (status) {
        return status >= 200 && status < 300; // 默認(rèn)的
    },
    // `maxRedirects` 定義在 node.js 中 follow 的最大重定向數(shù)目
    // 如果設(shè)置為0，將不會(huì) follow 任何重定向
    maxRedirects: 5, // 默認(rèn)的

    // `httpAgent` 和 `httpsAgent` 分別在 node.js 中用于定義在執(zhí)行 http 和 https 時(shí)使用的自定義代理。允許像這樣配置選項(xiàng)：
    // `keepAlive` 默認(rèn)沒(méi)有啟用
    httpAgent: new http.Agent({ keepAlive: true }),
    httpsAgent: new https.Agent({ keepAlive: true }),
    // "proxy" 定義代理服務(wù)器的主機(jī)名稱和端口
    // `auth` 表示 HTTP 基礎(chǔ)驗(yàn)證應(yīng)當(dāng)用于連接代理，并提供憑據(jù)
    // 這將會(huì)設(shè)置一個(gè) `Proxy-Authorization` 頭，覆寫掉已有的通過(guò)使用 `header` 設(shè)置的自定義 `Proxy-Authorization` 頭。
    proxy: {
      host: "127.0.0.1",
      port: 9000,
      auth: : {
        username: "mikeymike",
        password: "rapunz3l"
      }
    },
    // `cancelToken` 指定用于取"消請(qǐng)求的 cancel token
    // （查看后面的 Cancellation 這節(jié)了解更多）
    cancelToken: new CancelToken(function (cancel) {
   })
}

名詞講解：
http協(xié)議基本認(rèn)證 Authorization。
在瀏覽網(wǎng)頁(yè)的時(shí)候，瀏覽器會(huì)彈出一個(gè)登陸驗(yàn)證的對(duì)話框，如下圖，這就是使用HTTP基本renzheng。

HTTP基本認(rèn)證的過(guò)程。
第一步：客戶端發(fā)送http request給服務(wù)器。
第二步：因?yàn)閞equest中沒(méi)有包含Authorization header，服務(wù)器會(huì)返回一個(gè)401 Unauthozied給客戶端，并且在Response的header“WWW-Authenticate”中添加信息。


第三步：客戶端把用戶名和密碼用BASE64編碼后，放在Authorization header中發(fā)送給服務(wù)器， 認(rèn)證成功。

第四步：服務(wù)器將Authorization header中的用戶名密碼取出，進(jìn)行驗(yàn)證， 如果驗(yàn)證通過(guò)，將根據(jù)請(qǐng)求，發(fā)送資源給客戶端/。

HTTP OAuth認(rèn)證。
OAuth 對(duì)于Http來(lái)說(shuō)，就是放在Authorization header中的不是用戶名密碼， 而是一個(gè)token.

你可以指定將被用在各個(gè)請(qǐng)求的配置默認(rèn)值
全局的axios默認(rèn)值

axios.defaults.baseURl = "http://api";
aixos.defaults.headers.common["Authorization"]=AUTH_TOKEN;
axios.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

自定義實(shí)例默認(rèn)值

// 創(chuàng)建實(shí)例時(shí)設(shè)置配置的默認(rèn)值
var instance = axios.create({
  baseURL: "https://api.example.com"
});

// 在實(shí)例已創(chuàng)建后修改默認(rèn)值
instance.defaults.headers.common["Authorization"] = AUTH_TOKEN;

配置的優(yōu)先順序
配置會(huì)以一個(gè)優(yōu)先順序進(jìn)行合并。這個(gè)順序是：在lib/defaults.js找到庫(kù)的默認(rèn)值，然后是實(shí)例的defaults屬性，最后是請(qǐng)求的config參數(shù)。后者將優(yōu)先于前者。這里是一個(gè)例子：

//使用由庫(kù)提供的配置的默認(rèn)值來(lái)創(chuàng)建實(shí)例
//此時(shí)超時(shí)配置的默認(rèn)值是0
var instance= axios.create();
//覆寫庫(kù)的超時(shí)默認(rèn)值
//現(xiàn)在，在超時(shí)前，所有的請(qǐng)求都會(huì)等待2.5秒
instance.defaults.timeout = 2500;
//為已知需要花費(fèi)很長(zhǎng)時(shí)間的請(qǐng)求覆寫超時(shí)設(shè)置
instance.get("/url",{
    timeout:5000
})

在請(qǐng)求或響應(yīng)被then或catch處理前攔截它們

//添加請(qǐng)求攔截器
axios.interceptors.request.use(function(config){
        //在發(fā)送請(qǐng)求前做些什么
        return config;
    },functoin(err){
        //對(duì)請(qǐng)求錯(cuò)誤做些什么
        return Promise.reject(err);
});
//添加響應(yīng)攔截器
axios.interceptors.response.use(function(res){
        //對(duì)響應(yīng)數(shù)據(jù)做點(diǎn)什么
        return res;
    },function(err){
        //對(duì)響應(yīng)錯(cuò)誤做點(diǎn)什么
        return Promise.reject(err)
    }
)

如果你想在稍后移除攔截器，可以這樣：

var myInterceptor = axios.ineterceptors.request.use(function(){});
axios.interceptors.request.eject(myInterceptor);

可以為自定義axios實(shí)例添加攔截器

var instance = axios.create();
instance.interceptors.request.use(function(){});

使用cancel token取消請(qǐng)求?？梢允褂肅ancelToken.source工廠方法創(chuàng)建cancel token，像這樣：

var CancelToken = axios.CancelToken;
var source = CancelToken.source();
axios.get("/user/12345",{
    cancelToken:source.token
}).catch(function(thrown){
    if(axios.isCancel(thrown)){
        console.log("Request canceled",thrown.message)
    }else{
        //處理錯(cuò)誤
    }
});
//取消請(qǐng)求（message參數(shù)是可選的）
source.cancel("sadsad")

還可以通過(guò)傳遞一個(gè)executor函數(shù)到CancelToken的構(gòu)造函數(shù)來(lái)創(chuàng)建cancle token：

var CancelToken = axios.CancelToken;
var cancel;
axios.get("/user/12345",{
    cancelToken:new CnacelToken(function executor(c){
        //executor函數(shù)接受一個(gè)cancel函數(shù)作為參數(shù)
        cancel = c;
    })
});
//取消請(qǐng)求
cancel();