小程序关于请求同步的总结.pdfVIP

⼩程序关于请求同步的总结 在JavaScript中，提供了⼀些异步特性，因为同步操作会对程序的执⾏进⾏阻塞处理。⽐如在浏览器页⾯程序中，如果⼀段同 步的代码需要执⾏很长时间（⽐如⼀个很⼤的循环操作），则页⾯会产⽣卡死的现象。 异步为程序提供了性能和体验上的益处，⽐如可以将代码放到setTimeout()中执⾏；或者在⽹页中，我们使⽤Ajax的⽅式向服 务器端做异步数据请求。这些异步的代码不会阻塞当前的界⾯主进程，界⾯还是可以灵活的进⾏操作，等到异步代码执⾏完 成，再做相应的处理。 举⼀个例⼦：在⼩程序中，我们获取到后台的数据使⽤时间往往是不定的，这个时候：即使你在前⾯写的代码，也可能会在后 ⾯执⾏。 function getAccountInfo(callback, errorCallback) { wx.request({ url: /accounts/12345, success: function (res) { console(1) }, fail: function (res) { //... errorCallback(data); } }); console.log(2) } 也就是存在2输出在1前⾯的可能。这种策略提升页⾯加载速度。能很好的提⾼⽤户体验感。 但是请看下⾯的情景： ⼩程序是提倡不获取⽤户信息就能使⽤的，但是在特定的情况下我们必须要拿到⽤户的⼀些数据，⽐如名称，图像链接等等。 在这种情况下，我们⾸先获取⽤户的code，根据code去后台获取⽤户的openid或者unionid。拿到这些数据之后我们才能确定 ⽤户的⾝份，然后再去发新的请求(这些请求往往是需要⽤户⾝份凭证的，⽐如Token)。 上⾯的叙述中，我们发了三次请求，第⼀次获取code，第⼆次获取openID或unionid，第三次根据⾝份信息执⾏新的请求。我 们都知道JS 中的请求都是异步执⾏的，有可能微信服务端的code还没返回，⽤户已经去执⾏⼀些需要权限的操作，这就会导 致请求失败。那么⼩程序该如何解决这种问题呢？这⾥提供三种⽅案以供参考： 1.服务端⼀次请求全部处理。(使⽤范围太⼩) 2.客户端在请求成功的回调中，再次发送请求。（可⽤，但是代码会很冗长且不容易维护） 3.使⽤Promise ⽅案⼀中：⽐如⽤户留⾔功能，我们拿到code和留⾔内容后全部发给服务端，服务端开启⼀个新的线程去处理这些业务逻 辑，主线程直接返回⽤户留⾔成功的提⽰ （这⾥不考虑新线程执⾏失败的情况）。 ⽅案⼆和⽅案三功能上是相同的，但是代码的展⽰上可能⽅案三更加好⼀些。看下⾯的代码(其中postReq和getReq是⾃⼰封 装的请求⽅法) ： var http = require(request.js) function userLogin(name, image, gender, content, artilceId){ //获取code var promise = new Promise(function(resolve,reject){ wx.login({ success: res = { resolve(res.code); } }) }) //获取⽤户⾝份凭证 var pm2 = promise.then(function(res){ return new Promise(function (resolve, reject){ http.postReq(user/getUserInfo, { code: res, type: 1, name: name, image: image, gender: gender }, function (res) { // console.log(res) if (res.data == ) { wx.showModal({ title: 提⽰, content: 授权失败，请重试, }) return; } resolve(res); }) }) },function(res){ }) //发表评论 pm2.then(function(res){ // console.log(res.data+:+content) http.postReq(user/comment, { content: content, openId: res.data, artilceId: artilceId},function(res){