手动实现一个Ajax

9 天前(已编辑)
3

手动实现一个Ajax

1.手动实现一个Ajax

function myAjax(config){
    let {
        url,
        method = 'get',
        data = {},
        async = true,
        success,
        fail
    } = config

    let xml = new XMLHttpRequest()
    xml.onreadystatechange = function(){
        if(xml.readyState == 4){
            if((xml.status >= 200 && xml.status < 300) && xml.status == 304){
                const response = xml.responseText;
                success(response)
            }else{
                const error = xml.status
                fail(error)
            }
        }
    }
    xml.open(method, url, async)
    xml.send(data)
}

2.基于Promise封装一个Ajax

function promiseAjax(config){
    let {
        url,
        method = 'get',
        data = {},
        async = true,
        success,
        fail
    } = config

    return new Promise((resolve, reject)=>{
        let xml = new XMLHttpRequest();

        xml.open(method, url, async)
        xml.send(data)
        xml.onreadystatechange = function() {
            if(xml.readyState == 4){
                if((xml.status >= 200 && xml.status < 300) && xml.status == 304){
                    const response = xml.responseText
                    resolve(response)
                }else{
                    const error = xml.status
                    reject(error)
                }
            }
        }
        xml.onerror = function(){
            reject(new TypeError("请求出错"))
        }
        xml.timeout = function(){
            reject(new TypeError("请求超时"))
        }

    })
}

使用社交账号登录

  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...