Cette fois, je vais vous montrer comment ajax implémente l'encapsulation des requêtes réseau. Quelles sont les précautions pour qu'ajax implémente l'encapsulation des requêtes réseau. Ce qui suit est un cas pratique, jetons un coup d'œil.
Exemple de code :
// 封装的ajax网络请求函数 // obj 是一个对象 function AJAX(obj){ //跨域请求 if (obj.dataType == "jsonp") { //在这里 callback 必须是全局变量 保证函数消失的时候 这个变量不可以被销毁 //处理一下函数名(防止多个网络请求 函数名字相同 出现紊乱的情况) var hehe = "callBack" + "_" + new Date().getTime() + "_" + String(Math.random()).replace(".",""); window[hehe] = obj.success; //创建 script标签 var sc = document.createElement("script"); sc.src = obj.url + "?" + "cb=" + hehe; console.log(sc.src); document.body.appendChild(sc); document.body.removeChild(sc); return; } //1、创建 ajax 对象 var ajaxObj = null; if (window.XMLHttpRequest) { ajaxObj = new XMLHttpRequest(); }else{ ajaxObj = new ActiveXObject("Microsoft.XMLHTTP"); } //设置请求的类型 obj.type = obj.type.toUpperCase() || "GET"; //如果是get请求 并且需要传递参数 则需要给 url 后面拼接参数 if (obj.type == "GET") { var arr = [];//定义数组 用于把对象存储到数据里面 for (var key in obj.data) { arr.push(key +"="+ obj.data[key]); } //用&分隔数组 让其转化为类似:name=lxl&age=18 的形式 var str = arr.join("&"); obj.url = obj.url +"?"+ str; //拨号 ajaxObj.open(obj.type,obj.url,true); //发送"name=123&age=18" ajaxObj.send(); }else{ var arr = [];//定义数组 用于把对象存储到数据里面 for (var key in obj.data) { arr.push(key +"="+ obj.data[key]); //console.log(arr); } //用&分隔数组 让其转化为类似:name=lxl&age=18 的形式 var str = arr.join("&"); //console.log(str); ajaxObj.open(obj.type,obj.url,true); ajaxObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); ajaxObj.send(str); } //监听 ajaxObj.onreadystatechange = function(){ if (ajaxObj.readyState == 4) { if (ajaxObj.status >= 200 && ajaxObj.status < 300 || ajaxObj.status == 304) { //请求成功 obj.success(ajaxObj.responseText); }else{ //请求失败 obj.error(ajaxObj.status); } } } }
Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez faire attention aux autres sites Web chinois php Articles connexes !
Lecture recommandée :
Utilisé par la différence Ajax et JavaScript
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!