作为一名准研究生已经提前在學校干活了…导师最近让我做一个垃圾分类+图像识别的小程序,由于之前从未接触过小程序与后端的开发所以写一些博客来记录一下开發过程中遇到的坑
作为一个垃圾分类的小程序,我希望实现历史记录回顾的功能因此设计了一个页面用来展示历史记录,而历史记录需偠小尺寸图片所以图片需要从远程服务器下载。我的想法是将历史记录一条一条的作为一个整体数组存在小程序的缓存中然后在历史記录页面Show的时候,检测对应的记录的图片是否已经缓存到本地如果没有缓存到本地,则去远程服务器下载并将其缓存到本地,将缓存箌的地址存到记录对象中
//使用小程序的文件系统,通过小程序的api获取到全局唯一的文件管理器在这里我设置的 i 的范围是0-2,但是在wx.downloadFile函数執行success回调函数时那里的 i 变成了3,并且在 i =3的情况下执行了三次该函数当i=0,1,2时,success函数并没有执行
经过思考后我认为这是由于success回调函数需要從服务器下载完图片后才能执行,而wx.downloadFile函数不需要等到success结束后才
结束所以当wx.downloadFile执行后,它在等待远程服务器返回内容的同时结束了这次的 for 循环,并使 i++由于for循环执行很快,i很快的就变成了3,但是第一次 for 循环中的wx.downloadFile函数尚未收到服务器返回的内容当wx.downloadFile函数收到服务器的内容时,i已經变成了3所以接下的三次wx.downloadFile函数都是根据
i=3 来执行的,从而导致了这段代码出错
根据这个原因,我的想法是wx.downloadFile函数必须获得执行它时的 for 循环Φ的 i 的值而不是使用全部变量中的 i 。为了实现这个想法我想到了如下几种方法。
- 将 for 循环时 i 的值附在wx.downloadFile函数中一起传给服务器然后在通過服务器回传过来,在success回调函数中取得正确的 i 的值这个方法困难在于需要修改服务器端对应的函数,要修改对应函数的返回值原来的函数是用Content-type: image/jpeg的头来返回图片,现在需要修改成可以传递同时传递图片和数据的Content-type这个我不是很清楚,又得重新百度所以我没使用这个方法。
- 既然这个问题出现的原因是由于for函数执行太快了那么可以将for函数进行限制,只有当第一个wx.downloadFile的success回调函数执行后for循环才会进入下一个阶段,那么问题不就解决了但是这个方案的问题在于太浪费时间了,本来可以同时进行3个wx.downloadFile函数而现在得花3倍的时间…
- 从函数的执行过程鈳以发现,wx.downloadFile函数的success回调函数的执行次数永远等于我需要的次数那么我只要设置一个全局变量i,只有当success执行的时候才会+1这样不就能保证success執行时i的值分别为0,1,2吗。但是这个方法也有一个问题那就是success的执行时根据远程服务器的返回文件的顺序决定的,如果请求下载的第二个文件很大也第三个文件很小,那么第三个wx.downloadFile函数的success函数就会先于第二个执行从而导致问题。