# ajax封裝 ## 3.4.ajax封裝 **req方法：** ~~~ admin.req('url', { username: 'admin', password: '123456' }, function(res){ alert(res.code + '-' + res.msg); }, 'get', { headers: {} }); ~~~ * 參數一 ? 請求的url，前面會自動加setter.baseServer * 參數二 ? 非必填，請求參數 * 參數三 ? 請求回調（網絡錯誤也進此回調，404、403等） * 參數四 ? 非必填，請求方式，get、post、put、delete等，默認get * 參數五 ? 非必填，ajax的更多參數，如headers、dataType等 req的這五個參數是自動像左補齊的，可以簡寫： ~~~ // 無參數，get請求 admin.req('url', function(res){ console.log(res); }); // post提交 admin.req('url', function(res){ console.log(res); }, 'post'); admin.req('url', { username: 'xxx', password: '123456' }, function(res){ console.log(res); }, 'post'); // 參數使用JSON.stringify()會自動增加contentType為json admin.req('url', JSON.stringify(obj), function(res){ console.log(res); }, 'post'); // 相當于 admin.req('url', JSON.stringify(obj), function(res){ console.log(res); }, 'post', { contentType: 'application/json' }); // 參數使用表單序列化 admin.req('url', $('#demoForm').serialize(), function (res) { console.log(res); }, 'post', { contentType: 'application/x-www-form-urlencoded' }); ~~~ **ajax方法，參數同$.ajax：** ~~~ admin.ajax({ url: 'url', data: {}, headers: {}, type: 'post', dataType: 'json', success: function(res){ alert(res.code + '-' + res.msg); } }); ~~~ **自動傳遞header和預處理：** 在`assets/js/common.js`中的layui.config中增加方法： ~~~ layui.config({ // 自動傳遞header getAjaxHeaders: function (url) { var headers = []; headers.push({name: 'token', value: 'xxxxx'}); return headers; }, // 請求完成后預處理 ajaxSuccessBefore: function (res, url, obj) { if(res.code == 401) { alert('登錄超時，請重新登錄'); // obj.reload(); // 重新發起請求 // obj.update({}); // 修改res數據 // obj.xhr // ajax原始的xhr對象 return false; // 返回false阻止代碼執行 } return true; } }) ~~~ > req和ajax都實現了自動傳遞header、預處理、網絡錯誤也回調到success(404、500等錯誤)。