promise封装ajax

最新推荐文章于 2025-06-09 19:49:50 发布

原创最新推荐文章于 2025-06-09 19:49:50 发布 · 253 阅读

0 ·

CC 4.0 BY-SA版权

web 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了一个使用Promise封装HTTP请求的方法。该封装支持GET和POST请求，并通过XMLHttpRequest实现了请求发送。对于POST请求,它设置了正确的请求头并发送了表单编码的数据。此外，还演示了如何处理请求的成功和失败响应。

function pa(method, url, data) {
    return new Promise(function (resolve, reject) {
        const xhr = new XMLHttpRequest();
        const newmethod = method.toUpperCase();
        xhr.open(newmethod, url, true);
        if (method === 'POST') {
            xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
        }
        //level-1
        // xhr.onreadystatechange = function () {
        //     if (this.readyState === 4) {
        //         if (this.status === 200) {
        //             resolve(this.responseText, this);
        //         } else {
        //             let res = {code: this.status, response: this.response}
        //             reject(res, this)
        //         }
        //     }
        // };
        if (method === 'POST') {
            xhr.send(data)
        } else {
            xhr.send()
        }

      //level-2

      xhr.onload = resolve;

xhr.onerror = reject; })} pa('get', 'url') .then((value) => { console.log('then', value) }) .catch(error => { console.log('catch', error) })