当前位置: 萬仟网 > IT编程>开发语言>JavaScript > 控制台测试ajax

控制台测试ajax

2020年01月14日  | 萬仟网IT编程  | 我要评论

有的时候需要测试下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的原理,可以查看

 

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
Copyright © 2017-2020  萬仟网 保留所有权利. 粤ICP备17035492号-1
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com