封面

編寫常規的 AJAX 代碼并不容易，因為不同的瀏覽器對 AJAX 的實現并不相同。不過 jQuery 已經幫忙處理掉了這些兼容，但代碼寫多了還是覺得不爽，因為它不能給我以下的體驗:

1. 更簡單的鏈式 API；
2. 頁面中的所有請求要附加一些公共參數；
3. 不能統一處理服務返回的自定義錯誤；

新的 API

不愛動手的程序員不是好攻城獅。?? 因此，我基于 jQuery，重新封裝了一層。

這是一個例子

//附加公共參數
$http.global("token","abcd321"); 
$http.use("/api",  (res) =>  {
    if (res.success) {
        return true;
    }
    var err = res.error;
    if (err.code === 1001) {
        location.href = "/login.html";
    } else {
        alert(err.message);
    }
    return false;
});

$http.get("/api/user").type("json")
.param("id", 110) .send( (res) =>  { 
       // 過濾器處理完才會執行到這一步
       var datum = res.datum;
       alert("Name: " + datum.name);
       console.log(res.datum);
    }, (err) => {
       alert("查詢失敗了額");
       console.error(err);
     });

這是詳細的API說明

設置公共參數；

• $http.global(key, value);

設置過濾器；

• $http.use(urlPrefix, option [optinal], callback);

設置請求類型；

• $http.get(url);
• $http.getJson(url);
• $http.post(url);
• $http.put(url);
• $http.delete(url);

增加請求參數；

• $http.param(key, value);
• $http.params(paramJson);

設置請求頭；

• $http.header(key, value);
• $http.headers(paramJson);

其它擴展選項；

• $http.cache(boolean);
• $http.type("json/xml/html");
• $http.async(boolean);
• $http.timeout(number);

發送請求并處理回調；

• $http.send(options [optional], successCallback, errorCallback);

Gist 地址

https://gist.github.com/lenbo-ma/0213bfea8e3f08ff8d66

搜索微信號threetimes1992，關注我。

內容大多會是后端技術、前端工程、DevOps，偶爾會有一些大數據相關，會推薦一些好玩的東西。希望你會喜歡~
一切，源于喜歡。