優(yōu)雅的封裝ajax，含跨域

之前寫過一篇 先定一個小目標，自己封裝個ajax，是基于原生js的，也就是jquery中ajax的簡化版本實現(xiàn)的思路。眾所周知，jquery的ajax是項目中最常用的請求后臺的方式，也算是封裝的很完美的api了，然而漸漸的我們會發(fā)現(xiàn)，其實還可以根據實際項目需要更優(yōu)雅的進行一層封裝，先看調用方式：

熟悉EasyUI的猿們可能會覺得這種方式有點熟悉，沒錯，我就是看easyUI得到的啟發(fā)，也顯然這樣的方式更利于前端做判斷，邏輯更清晰明了。那么代碼后面是怎樣封裝的呢，我這里貼出核心的代碼以及思路。

思路

將后臺返回的不同業(yè)務狀態(tài)碼以函數回調的形式代替，減少if的多層級判斷。同時將通用的錯誤狀態(tài)碼邏輯（如這里的900狀態(tài)是通用異常）、通用的請求參數（如client客戶端來源，是否需要token證書)、請求前置觸發(fā)操作(如加載中動畫)等等進行統(tǒng)一處理，既減少的代碼量，同時又更利于維護。

封裝的js代碼

var LI = {    //發(fā)送get請求
    GET: function(options){        this.ajax(options,'get');
    },    //發(fā)送post請求
    POST: function(options){        this.ajax(options,'post');
    },
    ajax: function(options,type){        var opts = {
            isCommonBefore: true, //默認是通用的加載中動畫
            client: 1, //TODO這里應該根據內核判斷
            isCors: false,//默認不跨域
            isLogin: false
        }
        
        $.extend(true, options, opts || {});        
        //跨域，將請求地址 和 請求參數 都作為參數傳遞調用后臺固定的跨域接口
        if (opts.isCors) {
          &n
        
		

        		
網友評論
     		
				

			
			
			
		
		
		
    	
    	
        	

        		
更多精彩分享
        		

        			
        		
        			
	        		
	        		學習是年輕人改變自己的最好方式