微信小程序之音视频踩坑

  • 产品:需要做个音视频相关的产品
  • 我:哇哦,那可太兴奋了,没有做过的领域,那肯定非常有意思?
  • 产品: 巴拉巴拉过需求
  • 我:吭哧吭哧写需求,为什么这么多坑???

下面来介绍一下遇到的坑:

1.微信原生组件swiper 在IOS中可能造成滑动时swiper-item上文字闪动消失?

解决方案:文字闪动的标签上加上样式will-change: transform;

2.live-player有时候会出现黑屏?

解决方案:用wx-if进行销毁再重新渲染

3.之前都正常,忽然有一天用授权摄像头,声音授权的时候报错"{ "errMsg": "A:fail api scope is not declared in the privacy agreement", "errno": 112 }"?

解决方案:使用到了 A 隐私接口,但是开发者未在[mp后台-设置-服务内容声明-用户隐私保护指引]中声明收集 A 接口对应的隐私类型。补充的隐私类型声明, 将在5分钟后生效。

4.样式穿透问题,微信小程序原生组件camera、canvas、input(仅在focus时表现为原生组件)、live-player、live、pusher、map、textarea、video的层级是最高的,页面中的其他组件无论设置 z-index 为多少,都无法盖在原生组件上?

解决办法: 最靠谱的解决方法是弹出时,就把input框设置为view框,不能单纯的隐藏掉input框,因为当页面滑倒弹出框没有遮住的位置时,就什么都看不到了,这样也算是bug。

5.微信小程序有的组件固定在顶部,如果写死高度,每个手机高度不一致,导致不兼容?

解决方案: view都设置一个id属性,动态获取view高度

js 复制代码
let query = wx.createSelectorQuery().in(this)
          query.select('#search').boundingClientRect().exec(function(res) {
  console.log("rect", res[0].height)
})

6.live-player获取网络质量,远端断网,获取的网络质量还是1(网络很好的状态)?

暂时还没解决:我们换了另一种方案

7.live-player比live-pusher先展示,进房之后远端会黑屏,远端还会收到我本端退房的消息?

暂时还没解决,换方案了

8.如果不打开调试工具,不配置合法域名,这个项目会跑不起来

解决方案: 老老实实去微信公众平台上-开发管理-开发设置-服务器域名上设置下

9.不是合法的域名,在本地怎么开发?

解决方案: 微信开发者工具-右上角详情-本地设置-勾上不校验合法域名那个选项

10.有的时候ios手机上好的,安卓手机上运行报错?

解决方案:我发现我的代码有可能会同步,所以我改成了异步,但是不知道为啥ios为啥一直ok

11.小程序切后台后,远端一直收到小程序退房消息(集成的腾讯音视频)?

解决方案:在页面存在 mode='RTC' 的 live-pusher 和至少一个 live-player 时,小程序在后台运行的情况下可以正常采集和播放音频,否则小程序在切后台时会终止音视频通话。

  • 看下这两个组件是不是都设置了mode='RTC',我心大,以为默认RTC呢

  • 看下是否页面存在live-pusher 和至少一个 live-player

12.wx.uploadFile在微信真机调试看参数的时候,你是看不到formData里面的参数的?

解决方案:无,虽然看不到参数,但好在他传到服务端了,不慌

最后:有的想不起来了,再遇到继续更新

相关推荐
Q_Q51100828515 分钟前
python+uniapp基于微信小程序的学院设备报修系统
spring boot·python·微信小程序·django·flask·uni-app
李慕婉学姐19 分钟前
【开题答辩过程】以《自习室预约微信小程序》为例,不会开题答辩的可以进来看看
微信小程序·小程序
金梦人生40 分钟前
Css性能优化
前端·css
Holin_浩霖40 分钟前
UI设计的底层逻辑:从组件到系统的跃迁
前端
Holin_浩霖41 分钟前
前端开发者的 Web3 全图解实战 二
前端
写代码的皮筏艇41 分钟前
CSS属性继承与特殊值
前端·css
kevlin_coder44 分钟前
🚀 实现同一个滚动区域包含多个虚拟滚动列表
前端·javascript
金梦人生1 小时前
JS 性能优化
前端·javascript
peachSoda71 小时前
自定义配置小程序tabbar逻辑思路
javascript·vue.js·微信小程序·小程序
我有一棵树1 小时前
使用Flex布局实现多行多列,每个列宽度相同
前端·css·html·scss·flex