基于Vue公众号开发中的哪些坑 (严重鄙视ios,遇到的坑基本都是在ios中)

时间:2022-03-31 05:32:49

一、ios白屏问题
ios端基于vue开发的H5无法正常显示,白屏问题
1、代码问题
确定方法:在ie/edge浏览器中打开,看是否正常显示,如果仍然白屏,可以确定问题
解决方法:1、代码中是否使用es6,如果使用,确定使用es6转es5,(npm install babel-polyfill
npm install es6-promise)
2、参考 https://www.cnblogs.com/love314159/articles/9355785.html
3、以上方法都不行的话,查看源码是在main,js中按需引入了相关的UI组件(本人引入 iview组件 DatePicker,Select 在edge,ios编译报错,进而导致不显示)

 

、公众号开发分享缩略图,描述不显示,显示为分享地址
1、是否为本地测试公众号开发要求 配置js安全接口,因此,本地测试无法查看具体效果
2、缩略图地址是否为在线地址,本地地址不显示
3、当前页面分享地址与当前页面地址是否一致
4、是否使用的最新版本的jssdk,建议旧接口分享同样配置一次


、二次分享缩略图,描述不显示,显示为分享地址
进入分享页,选择分享,如果此时复制链接可以发现,地址中被拼接了字符串,安卓中拼接了一个字段,大部分ios中拼接了这个字段,但即使将当前拼接字段作为分享地址,仍然会出现以上问题。
直接暴力解决方法,判断当前地址是否携带有参数,有的话直接执行 document.location.replace(location.pathname); vue中router.replace()ios不生效 ,该方法页面将刷新一次

 

四、音乐自动播放问题
iso不能自动播放(部分可以,但是有一定的延时)
1、静音播放,用户手动取消静音
2、用户手动开启播放
3、添加全局监听事件(只生效一次),用户有任何操作,音乐自动播放
// document.addEventListener(‘touchstart‘,function(){
// _this.isMusicPlay = true;
// _this.$refs.audio.play();
// },{once: true})