码迷,mamicode.com
首页 > Web开发 > 详细

Promise实现ajax

时间:2018-10-16 13:38:11      阅读:202      评论:0      收藏:0      [点我收藏+]

标签:isp   浏览器   splay   cti   catch   ted   log   对象   www   

利用Promise实现ajax

 

GET

技术分享图片
    function getAjax(url) {
        return new Promise((resolved,rejected)=>{
            //创建ajax对象
            let ajax = new XMLHttpRequest();
            //配置参数
            ajax.open(‘get‘,url,true)
            //发送请求
            ajax.send();
            //请求成功之后
            ajax.onload = function () {
                if(this.status === 200){
                    console.log(ajax.responseText)
                    resolved(ajax.responseText);
                }else{
                    rejected();
                }

            }
        })
    }
View Code
getAjax(url).then().catch()

 

POST

技术分享图片
    function postAjax(url,param) {
        return new Promise((resolved,rejected)=>{
            //创建ajax对象
            let ajax = new XMLHttpRequest();
            //配置参数
            ajax.open(‘post‘,url,true);

            //设置请求头,表示我传递的参数的类型
            xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            //发送请求,并将数据传递过去
            ajax.send(JSON.stringify(data));

            //请求成功之后
            ajax.onload = function () {
                if(this.status === 200){
                    console.log(ajax.responseText)
                    resolved(ajax.responseText);
                }else{
                    rejected();
                }

            }
        })
    }
View Code
getAjax(url,param).then().catch()

 

GET \POST合并

技术分享图片
    function myAjax(type,url,params) {
        return new Promise((resolved,rejected)=>{

            //创建ajax对象
            let ajax;
            //注意,不要根据浏览器的navigator.userAgent来检测浏览器是否支持某个JavaScript特性,一是因为这个字符串本身可以伪造,二是通过IE版本判断JavaScript特性将非常复杂。
            if (window.XMLHttpRequest) {
                ajax = new XMLHttpRequest();
            } else {
                ajax = new ActiveXObject(‘Microsoft.XMLHTTP‘);
            }


            if(type == ‘get‘ || type == ‘‘){//get
                //配置参数
                ajax.open(‘get‘,url,true)
                //发送请求
                ajax.send();
            }else if(type == ‘post‘){//post
                //配置参数
                ajax.open(‘post‘,url,true);
                //设置请求头,表示我传递的参数的类型
                xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                //发送请求,并将数据传递过去
                ajax.send(JSON.stringify(data));
            }

            //请求成功之后
            request.onreadystatechange = function (){
                if (request.readyState === 4){
                    if(this.status === 200){
                        console.log(ajax.responseText)
                        resolved(ajax.responseText);
                    }else{
                        rejected();
                    }
                }
            }

        })
    }
View Code
    getAjax(‘get‘).then().catch()
    getAjax(‘post‘,param).then().catch()

 

Promise实现ajax

标签:isp   浏览器   splay   cti   catch   ted   log   对象   www   

原文地址:https://www.cnblogs.com/shaokevin/p/9796882.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!