有的时候需要测试下web项目中post、get请求是否正确,但是这个时候电脑上没有安装测试工具,怎么办呢?直接用浏览器控制台测试,打开网站,F12控制台,在控制台下复制粘贴下面的ajax请求,之后ajax请求。
第一步:控制台写方法
function ajax(req){ var xhr=new XMLHttpRequest(); xhr.onreadystatechange=function(){ if(xhr.readyState===4){ req.success&&req.success(xhr.responseText,xhr.status); } } req.method=req.method?req.method.toUpperCase():'GET'; var data=null; var url=req.url; if(req.data){ var arg=''; for(var n in req.data){ arg+=n+'='+encodeURIComponent(req.data[n])+'&' } arg=arg.slice(0,-1); if(req.method==='GET'){ url=url+'?'+arg; }else{ data=arg; } } if(req.headers){ for(var h in req.headers){ var v=req.headers[h]; xhr.setRequestHeader(h,v); } } xhr.open(req.method,url); xhr.send(data); }
第二步:控制台调用
ajax({url:"",method:"",data:{},headers:{},success:function(res){console.log(res)}})
url:请求的URL,method:post/get,data:参数,success:返回的数据打印出来
解释
XMLHttpRequest 是 AJAX 的基础。XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
当请求被发送到服务器时,我们需要执行一些基于响应的任务。每当 readyState 改变时,就会触发 onreadystatechange 事件。
简单的ajax例子:
var xmlhttp=new XMLHttpRequest(); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { console.log(xmlhttp.responseText); } } xmlhttp.open("GET","url",true); xmlhttp.send();
参考
想了解更多ajax的原理,可以查看 【runoob中的介绍】