分享一个http请求工具类(JS向)

2020-02-12 04:07:52  卢浮宫  阅读量:948  版权声明:本文为站长原创文章,转载请写明出处


一、为什么会有这个?

    每次看到自己的项目中一堆的$.ajax...就觉得很臃肿。

    于是:封装起来吧。

二、找了一个比较好的封装,这里记录下。

    

 class HttpClient {    get({url}) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'GET',
}).then(res => res.json())
.then(data => resolve(data))
.catch(error => reject(error));
})
}

post({url, data}) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data),
}).then(res => res.json())
.then(res => {
resolve(res);
})
.catch(error => {
reject(error);
});
})
}

}


三、使用方法

    1、引入该工具

        const httpClient = new HttpClient();

        普通get请求如下(使用箭头函数可以有效的解决this指向问题)

        httpClient.get({url'/XXX.com?artiXX=XXX'}).then(res => {

         if (res.code === 0) {
            // doSomething...
     } else {
            // doSomething...
     }
      });
   2、post请求如下
    httpClient.post({

url: "/guangmuhXXX",
data: reqParams
}).then(res => {
if (res.code === 0) {

                // doSomething...

} else {

                // doSomething...                
              }

});

最新评论: