mui ajax方法詳解:
mui提供了mui.ajax,在此基礎上有分裝出mui.get()/mui.getJSON()/mui.post()三個方法。
mui.ajax( url [,settings] )
mui.ajax( url [,settings] )
url
Type: String
請求發送的目標地址
settings
Type: PlainObject
key/value格式的json對象,用來配置ajax請求參數,支持的完整參數參考如下mui.ajax([settings])方法
mui.ajax([settings])
settings
Type: PlainObject
key/value格式的json對象,用來配置ajax請求參數,支持的詳細參數如下:
async
Type: Boolean
發送同步請求
crossDomain *5+ only
Type: Boolean
強制使用5+跨域
data
Type: PlainObject||String
發送到服務器的業務數據
dataType
Type: String
預期服務器返回的數據類型;如果不指定,mui將自動根據HTTP包的MIME頭信息自動判斷;支持設置的dataType可選值:
"xml": 返回XML文檔
"html": 返回純文本HTML信息;
"script": 返回純文本JavaScript代碼
"json": 返回JSON數據
"text": 返回純文本字符串
error
Type: Functon(XMLHttpRequest xhr,String type,String errorThrown)
請求失敗時觸發的回調函數,該函數接收三個參數:
xhr:xhr實例對象
type:錯誤描述,可取值:"timeout", "error", "abort", "parsererror"、"null"
errorThrown:可捕獲的異常對象
success
Type: Functon(Anything data,String textStatus,XMLHttpRequest xhr)
請求成功時觸發的回調函數,該函數接收三個參數:
data:服務器返回的響應數據,類型可以是json對象、xml對象、字符串等;
textStatus:狀態描述,默認值為'success'
xhr:xhr實例對象
timeout
Type: Number
請求超時時間(毫秒),默認值為0,表示永不超時;若超過設置的超時時間(非0的情況),依然未收到服務器響應,則觸發error回調
type
Type: String
請求方式,目前僅支持'GET'和'POST',默認為'GET'方式
headers
Type: Json
指定HTTP請求的Header
headers:{'Content-Type':'application/json'}
processData
Type: Boolean
為了匹配默認的content-type("application/x-www-form-urlencoded"),
mui默認會將data參數中傳入的非字符串類型的數據轉變為key1=value&key2=value2格式的查詢串;
如果業務需要,希望發送其它格式的數據(比如Document對象),可以設置processData為false
代碼示例:如下為通過post方式向某服務器發送鑒權登錄的代碼片段
mui.ajax('http://server-name/login.php',{
data:{
username:'username',
password:'password'
},
dataType:'json',//服務器返回json格式數據
type:'post',//HTTP請求類型
timeout:10000,//超時時間設置為10秒;
headers:{'Content-Type':'application/json'},
success:function(data){
//服務器返回響應,根據響應結果,分析是否登錄成功;
...
},
error:function(xhr,type,errorThrown){
//異常處理;
console.log(type);
}
});
mui.post()方法是對mui.ajax()的一個簡化方法,直接使用POST請求方式向服務器發送數據、且不處理timeout和異常(若需處理異常及超時,請使用mui.ajax()方法),使用方法: mui.post(url[,data][,success][,dataType]),如上登錄鑒權代碼換成mui.post()后,代碼更為簡潔,如下:
mui.post('http://server-name/login.php',{
username:'username',
password:'password'
},function(data){
//服務器返回響應,根據響應結果,分析是否登錄成功;
...
},'json'
);
mui.get()方法和mui.post()方法類似,只不過是直接使用GET請求方式向服務器發送數據、且不處理timeout和異常(若需處理異常及超時,請使用mui.ajax()方法),使用方法: mui.get(url[,data][,success][,dataType]),如下為獲得某服務器新聞列表的代碼片段,服務器以json格式返回數據列表
mui.get('http://server-name/list.php',{category:'news'},function(data){
//獲得服務器響應
...
},'json'
);
如上mui.get()方法和如下mui.ajax()方法效果是一致的:
mui.ajax('http://server-name/list.php',{
data:{
category:'news'
},
dataType:'json',//服務器返回json格式數據
type:'get',//HTTP請求類型
success:function(data){
//獲得服務器響應
...
}
});
mui.getJSON()方法是在mui.get()方法基礎上的更進一步簡化,限定返回json格式的數據,其它參數和mui.get()方法一致,使用方法: mui.get(url[,data][,success]),如上獲得新聞列表的代碼換成mui.getJSON()方法后,更為簡潔,如下:
mui.getJSON('http://server-name/list.php',{category:'news'},function(data){
//獲得服務器響應
...
}
);
以上內容獲取為文檔,詳情請閱讀文檔。
http://dev.dcloud.net.cn/mui/ajax/