前言
在此之前,笔者写过一篇网络请求封装的博客,但是那时候写的是封装成果,而非封装经过,因此在这篇博客上进行封装经过的补充介绍。
uni.request 的使用
在最开始,笔者不太习惯看 UNI-APP 官方文档或者说是很少有独立去看官方文档的习惯!笔者也不太懂微信小程序怎么向服务器发起网络请求。
当时好像在百度上输入了关键字 “uni-app怎么向服务器发起请求”,然后看了一大堆文档,最终都是指向uni.request。
然后就搜起了uni.request,最后发现原来UNI-APP官方文档里面有这 API !并且有详细的使用说明!
但是笔者作为一名几乎很少独立去看官方文档的人,是挺难看多这些字段啊什么表达的是什么意思,具体怎么使用的虽然文档下面有代码样例,但是笔者也不太会使用!
这里读者可能会问:连官方文档都不会看,那你是怎么学习后端知识的?
答:B站大学YYDS,里面的讲师说过很多次:“虽然现在的技术有我给你们带路,带你们看源码,带你们看文档。但是以后假如又有新技术出现了呢?这就得自己去看官方文档,自己去琢磨和学习了,所以大家最好是培养这样的学习习惯。” 所以有人带路,和自己亲身经历是截然不同的效果。
最终还是慢慢的读懂了官方文档,并成功向自己开的本地8080端口发起了网络请求。
网络请求封装
为什么要对网络请求进行封装呢?
答:笔者当时觉得每次都写一大堆重复请求代码,是十分繁琐且没有必要的,所以决定对网络请求进行封装。
前端知识的补充学习
当然,以笔者当时的水平必然是不会对网络请求进行封装的,因此就在CSDN上搜到了大量类似网络请求封装。这一搜不要紧,主要是他们的封装内容,有好多关键字是笔者看不懂的,比如箭头函数、回调函数、async、await和promise等等。
所以笔者当时十分痛苦!!基本上就是被无限套娃 —— 做一个功能的时候,发现“这个”不会,然后就去学习“这个”,但是学习过程中又悲剧的发现“这个”里面还有“那个”不会。。。依次直到触底。。
论 async、await 、Promise 之间的关系
学习总结:异步编程的最高境界就是不关心它是否是异步。async、await很好的解决了这一点,将异步强行转换为同步处理。
async/await与promise不存在谁代替谁的说法,因为async/await是寄生于Promise,Generater的语法糖。
故在理解了这一层后,就很容易对 uni.request 进行封装了。
请求封装设计思路
实现方案
笔者结合上面那篇文章,进行了请求封装,很显然 uni.request() 括号内的参数为一个配置对象,内含url、method等等,因此笔者对这个配置对象进行了抽离。
config: {
// baseUrl: "http://localhost:8088/",
header: {
"Content-Type":"application/json"
},
data: {
},
method: "GET",
/* 如设为json,会对返回的数据做一次 JSON.parse */
dataType: "json",
responseType: "text",
success() {
},
fail() {
},
complete() {
}
},
抽离之后,需要将这些配置从外部传递进来, 结合别人的封装方法,笔者因此创建一个 request(options) 方法,返回的是 Promise 对象,并且将对应的参数传递到对应的字段上。
request(options