摘要：需求場景借助來自定義擴(kuò)展功能。項(xiàng)目需求版本，錯(cuò)誤打點(diǎn)，發(fā)起請求發(fā)生錯(cuò)誤的時(shí)候前端需要向打點(diǎn)地址發(fā)送一個(gè)請求。項(xiàng)目需求防止請求的重復(fù)提交簡單演示解決方案不重復(fù)發(fā)送相同請求測試代碼

項(xiàng)目需求：jQuery 版本： 1.10.2，錯(cuò)誤打點(diǎn)，發(fā)起 jsonp 請求發(fā)生錯(cuò)誤的時(shí)候前端需要向打點(diǎn)地址發(fā)送一個(gè)請求。

簡單演示：
測試代碼：

   $.ajax("http://google.com/a.js", {
       type: "GET",
       dataType: "jsonp",
       success: function(success, statusText, jqXHR){
           console.log("jsonp request success");
       },
       error: function(jqXHR, statusText, error){
           console.log("jsonp error");
       }
   });
   
   由于 1.10.2 版本的 jquery 并沒有對創(chuàng)建的 script 監(jiān)聽錯(cuò)誤事件，故無法調(diào)用 error 方法，故無法進(jìn)一步將前端信息錯(cuò)誤上報(bào)
   

解決方案：

   $.ajaxTransport("+script", function(s){
       // This transport only deals with cross domain requests
       var script,
            head = document.head || $("head")[0] || document.documentElement;
            
       return {
           send: function(_, callback) {
               
               script = document.createElement("script");
               
               script.async = true;
               
               if(s.scriptCharset){
                   script.charset = s.scriptCharset;
               }
               
               script.src = s.url;
               
               // Handle error
               script.onerror = function(err){
                   // Handle memory lead in IE
                   script.onload = script.onreadystatechange = null;
                   script.onerror = null;
                   
                   // Remove the script
                   if(script.parentNode){
                       script.parentnode.removeChild(script);
                   }
                   
                   // Dereference the script
                   script = null;
                   
                   if(err.type === "error"){
                       callback(404, err.type);
                   }
               }
               
               // Attach handlers for all browsers
               script.onload = script.onreadystatechange = function(_, isAbort){
                   
                   if(isAbort || !script.readyState || 
                   /loaded|complete/.test(script.readyState)){
                       // Handle memeory leak in IE
                       script.onload = script.onreadystatechange = null;
                       
                       // Remove the script
                       if(script.parentNode){
                           script.parentNode.removeChild(script);
                       }
                       
                       // Dereference the script
                       script = null;
                       
                       // Callback if not abort
                       if(!isAbort){
                           callback(200, "success");
                       }
                   }
               };
               
               // Cicumvent IE6 bugs with base elements (#2709 and #4378) by prepending
               // Use native DOM manipulation to avoid our domManip AJAX trickery
               head.insertBefore(script, head.firstChild);
           },
           
           abort: function(){
               if(script){
                   script.onload(undefined, true);
               }
           }
       };
   });

項(xiàng)目需求：需要從服務(wù)器獲取 yaml 文件，然后解析該文件

簡單演示：
解決方案：

   function parseYaml(text){
       console.log("You are parsing yaml file!");
       return "yaml" + text + "yaml";
   }
   $.ajaxSetup({
       accepts: {
           yaml: "application/x-yaml, text/yaml"
       },
       contents: {
           yaml: /yaml/
       },
       converters: {
           "text yaml": function(text){
               return parseYaml(text);
           }
       }
   });

測試代碼：

   // 發(fā)送 dataType 為 yaml 的請求
   $.ajax({
       url: "http://google.com/helloworld.yaml",
       dataType: "yaml",
       success: function(data){
           console.log(data);
       }
   });

項(xiàng)目需求：防止 ajax 請求的重復(fù)提交

簡單演示：
解決方案：
var pendingRequests = {};

function storePendingRequest(key, jqXHR){

   pendingRequests[key] = true;
   jqXHR.pendingRequestKey = key;

}

function generatePendingRequestKey(options){

   return (options.type + options.url + options.dataType).toLowerCase().replace(/[^a-z0-9]/g, "");

}
$.ajaxPrefilter(function( options, originalOptions, jqXHR ) {

   
   // 不重復(fù)發(fā)送相同請求
   var key = generatePendingRequestKey(options);
   if (!pendingRequests[key]) {
       storePendingRequest(key, jqXHR);
   } else {
       // or do other
       jqXHR.abort();
   }
   
   var complete = options.complete;
   options.complete = function(jqXHR, textStatus) {
       // clear from pending requests
       pendingRequests[jqXHR.pendingRequestKey] = null;
       
       if ($.isFunction(complete)) {
           complete.apply(this, arguments);
       }
   };

});

測試代碼：
for(var i = 0; i < 10; i++){

   var j = 0;
   $.ajax({
       url: "http://js.passport.qihucdn.com/5.0.2.js",
       type: "GET",
       dataType: "HTML",
       complete: function(){
           console.log("complete:" + j++);
       }
   });

}