前沿
最近接触到weex的一个商城项目,主要用得技术栈是 weex+vue ,不了解weex的同学可以移步weex官方文档 该项目主要是做淘宝优惠券的自动查找功能,类似于市面上的淘客APP,既然是一款c端产品那么当然涉及到微信分享、微信登陆这些主要的引流入口。
需求分析
进入主题,接到一个需求是,分享多张图片或单张到微信,这个功能本身是很简单就能实现的,拿到后台的图片数组传给IOS和安卓,他们直接唤起微信就ok了。但是,别太天真,产品的需求并非如此,而是分享的同时需要给我们分享的图片打上我们专有商品分享二维码,那么问题来了,因为weex不支持canvas画布,所以前端这边无法生成二维码,(这一点必须吐槽下weex),后台打码到图片上需要时间,也就是说这个接口请求速度对用户非常不友好,后来也证实了我的猜想,而且接口请求的速度慢还导致原生app那边API不能正常调起微信:
解决方案
与后台沟通,发现单张图片和多张图片不是同一接口,且单张的图片比多张图片打码的速度快很多的,那么解决方案就有了,可以采用Promise.all异步调取单张图片的接口,调取多次单张图片的接口这样就可以避免等待多张图片全部打码完成的时间了,代码如下:
//底部播货按钮popup
async sowBtnpost(project_id){
let sessid = await util.getItem('txb_sessid') //用户登陆信息是否失效
if(sessid){
this.shareImg = [] //初始化图片数组
if(this.isClick) return
let postUrl
let funcArray = [] //初始化方法数组
let sendData = {
project_id:project_id}
if(this.changeiconType){
postUrl = "/home/share_project_good_single" //多图分享
console.