微信公众号视频录制开发 踩坑汇总

背景

微信公众号（PC）实现视频录制，技术栈 react。

1. http or https

视频录制如果是基于navigator.mediaDevices 这种方式，http协议下只能通过localhost 本地调试获取相关api，部署服务器上后会navigator不再具备mediaDevices的能力（PC同理）。解决方案：换https。

2. recorder lib compare

MediaStreamRecorder 去开发视频录制，ui较丑，且录制完成后 ios 回调有问题，无法拿到数据。个人尝试将 录制的stream buffer 拼接 获取的数据依旧无法播放。

react-video-recorder ios 在https的协议下无法录制。但可以放在http 协议下 运行。原因是此库 做了降级处理，不支持navigator 后会调用 这种方式，在微信公众号中，可以唤醒手机摄像头，达到录制视频的功能，缺点是ios 无法播放回调的blob资源。（降级处理：可以将资源上传至远端在播放，录制的视频不太大的情况下）。

在这里插入图片描述

综合比较，推荐react-video-recorder 。