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

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

使用npm:

$ npm install axios

使用bower

$ bower install axiso

使用cdn：

執(zhí)行GET請求

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

執(zhí)行POST請求

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

執(zhí)行多個并發(fā)請求,.then以后使用axios.spread方法分割請求的數(shù)據(jù)，一一對應(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){
    //兩個請求現(xiàn)在都執(zhí)行完成
}))

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

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

為方便起見，為所有支持的請求方法提供了別名
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)建實例
axios.create([config])

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

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

請求配置

{
    //url是用于請求服務(wù)器的url
    url:"/user",
    //method是創(chuàng)建請求時使用的方法
    method:"get",
    //baseUrl將自動加在url前面，除非url是一個絕對url。
    //它可以通過設(shè)置一個baseUrl便于axios實例的方法傳遞相對URL
    baseUrl:"https://some-domain.com/api/",
    //transformRequest允許在向服務(wù)器發(fā)送前，修改請求的數(shù)據(jù)。
    //只能用在post，put，patch這幾個請求方法
    //后面數(shù)組中的函數(shù)必須返回一個字符串，或ArrayBuffer，或Stream
    transformRequest:[function(data){
       //對data進行任意轉(zhuǎn)換處理。
       return data;
    }],
    //Transform Response在傳遞給then/catch錢，允許修改響應(yīng)的數(shù)據(jù)
    transformResponse：[function(data){
        //對data進行任意轉(zhuǎn)換處理
        return data;
    }],
    //headers是即將被發(fā)送的自定義請求頭
    headers:{"X-Requested-With": "XMLHttpRequest"},
    //params是即將與請求一起發(fā)送的url參數(shù)
    //必須是一個無格式對象plain object或URLSearchParams對象
    params:{
        ID:12345
    },
    //paramsSerializer是一個負(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是作為請求主體被發(fā)送的數(shù)據(jù)
    //只適用與put，post，和patch
    //在沒有設(shè)置transformRequest時，必須是以下類型之一：string，plain object，ArrayBuffer，ArrayBufferView，URLSearchParams
    data: {
        firstName: "Fred"
    },
    //timeout指定了請求超時的毫秒數(shù)，
    //如果請求超過了timeout的時間，請求將被中斷，
    timeout:1000,
    //withCredentials表示跨域請求時是否需要使用憑證，
    withCredentials:false,//默認(rèn)值
    //adapter允許自定義處理請求，以使測試更輕松，
    //返回一個promise并應(yīng)用一個有效的響應(yīng)。
    adapter:function(config){},
    //auth表示應(yīng)該使用http基礎(chǔ)驗證，并提供數(shù)據(jù)。
    //這將設(shè)置一個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允許為上傳處理進度事件。
    onUploadProgress：function(progressEvent){
        //對原生進度事件的處理
    },
    //onDownloadProgress允許為下載處理進度事件。
    onDownloadProgress:function(){
        //對原生進度事件的處理
    },
    //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，將不會 follow 任何重定向
    maxRedirects: 5, // 默認(rèn)的

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

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

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


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

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

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

你可以指定將被用在各個請求的配置默認(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";

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

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

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

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

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

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

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

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

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

可以為自定義axios實例添加攔截器

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

使用cancel token取消請求?？梢允褂肅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{
        //處理錯誤
    }
});
//取消請求（message參數(shù)是可選的）
source.cancel("sadsad")

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

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