Skip to content

Latest commit

 

History

History
351 lines (312 loc) · 20.6 KB

摄像头推流.md

File metadata and controls

351 lines (312 loc) · 20.6 KB
Raw

<live-pusher> 是小程序内部用于支持音视频上行能力的功能标签，本文主要介绍该标签的使用方法。

版本支持

  • 微信 App iOS 最低版本要求：6.5.21。
  • 微信 App Android 最低版本要求：6.5.19。
  • 小程序基础库最低版本要求：1.7.0。

?通过 wx.getSystemInfo 可以获取当前基础库版本信息。

使用限制

出于政策和合规的考虑，微信暂时没有放开所有小程序对 <live-pusher> 和 <live-player> 标签的支持：

  • 个人账号和企业账号的小程序暂时只开放如下表格中的类目：
一级类目/主体类型二级类目资质要求类目适用范围小程序直播内容场景
社交 直播 （3选1）：
1.《信息网络传播视听节目许可证》
2.《网络文化经营许可证》(经营范围含网络表演）
3.《统一社会信用代码》 及 《情况说明函件》（适用于政府主体）		 适用于提供在线直播等服务
注：
1. 如提供时政信息服务，需补充：时政信息类目
2. 选择该类目后首次提交代码审核，需经当地互联网主管机关审核确认，预计审核时长7天左右		 涉及娱乐性质，如明星直播、生活趣事直播、宠物直播等。选择该类目后首次提交代码审核，需经当地互联网主管机关审核确认，预计审核时长7天左右
教育 在线视频课程 （5选1）：
1. 《事业单位法人证书》（适用公立学校）
2. 区、县级教育部门颁发的《民办学校办学许可证》（适用培训机构）
3. 《信息网络传播视听节目许可证》
4. 全国校外线上培训管理服务平台备案
5. 教育部门的批准文件
 		适用于教育行业提供，网课、在线培训、讲座等教育类视频/直播等服务 网课、在线培训、讲座等教育类直播
医疗 互联网医院 （2选1）：
1. 卫生健康部门的《设置医疗机构批准书》；
2. 合作医院的《医疗机构执业许可证》与执业登记机关的审核合格文件		 适用于互联网医院主体/医疗服务平台提供在线看诊、疾病咨询等线上医疗服务 问诊、大型健康讲座等直播
公立医疗机构 《医疗机构执业许可证》与《事业单位法人证书》 适用于公立医疗机构提供的就医、健康咨询/问诊、医疗保健信息等服务
金融 银行 （2选1）：
1.《金融许可证》
2.《金融机构许可证》		 适用于提供银行业务在线服务或交易等服务 金融产品视频客服理赔、金融产品推广直播等
信托 （2选1）：
1.《金融许可证》
2.《金融机构许可证》		 适用于提供信托理财业务在线服务或交易等服务
公募基金 （3选1）：
1.《经营证券期货业务许可证》且业务范围必须包含“基金”
2.《基金托管业务许可证》
3.《基金销售业务资格证书》		 适用于基金管理公司从事股票、债券等金融工具的投资服务
私募基金 （2选1）：
1.《私募基金备案证明》
2.《私募投资基金管理人登记证书》		 仅适用于私募基金展示、介绍、咨询等服务
注：暂不支持涉及私募产品公开募集或在线交易等服务
证券/期货 《经营证券期货业务许可证》 适用于提供证券资讯、证券咨询、证券期货经营等的在线服务
证券、期货投资咨询 （2选1）：
1.《证券投资咨询业务资格证书》
2.《经营证券期货业务许可证》 		适用于提供证券、期货投资等在线咨询服务
保险 （8选1）：
1.《保险公司法人许可证》
2.《经营保险业务许可证》
3.《保险营销服务许可证》
4.《经营保险代理业务许可证》
5.《经营保险经纪业务许可证》
6.《经营保险公估业务许可证》
7.《经营保险资产管理业务许可证》
8.《保险兼业代理业务许可证》 		适用于提供保险业务在线服务或交易等服务
征信业务 （2选1）：
1.经营个人征信业务：《个人征信业务经营许可证》、《营业执照》
2.经营企业征信业务：经所在地的中国人民银行及其派出机构备案的《企业征信业务经营备案证》、《营业执照》 		适用于银行或征信机构提供征信业务服务，包括：信贷记录、逾期记录、失信人查询等
新三板信息服务平台 全国中小企业股份转让系统有限责任公司的书面许可与《非经营性互联网信息服务备案核准》 适用于提供新三板信息行情资讯等服务
股票信息服务平台（港股/美股） 《非经营性互联网信息服务备案核准》 适用于提供港股、美股行情资讯、行情分析等服务
注：如提供股票交易服务，需补充：金融业-证券/期货类目
消费金融 银监会核准开业的审批文件与《金融许可证》与《营业执照》 适用于提供消费金融线上服务或交易等服务
汽车 汽车预售服务 （3选1）：
1.汽车厂商：《营业执照》与《工信部道路机动车辆生产企业准入许可》
2.汽车经销商/4s店：《营业执照》与《厂商授权销售文件》与《工信部道路机动车辆生产企业准入许可》
3.下属子/分公司：《营业执照》与《工信部道路机动车辆生产企业准入许可》与《股权关系证明函》（含双方盖章） 		适用于提供汽车在线预付款等服务
注：平台暂不支持在线整车销售，如涉及整车销售服务，建议改为价格指导或移除相关功能		 汽车预售、推广直播
政府主体帐号 - - - 政府相关工作推广直播、领导讲话直播等
工具 视频客服 - 适用于提供企业售后客服一对一视频等服务 不涉及以上几类内容的一对一视频客服服务，如企业售后一对一视频服务等
>? 可申请直播标签的小程序类目以 [微信文档](https://developers.weixin.qq.com/miniprogram/dev/component/live-pusher.html) 说明为主，小程序类目的资质要求详见 [非个人主体类目申请](https://developers.weixin.qq.com/miniprogram/product/material/#非个人主体小程序开放的服务类目)。 - 符合类目要求的小程序，需要在小程序管理后台的**开发管理**>**接口设置**中自助开通该组件权限，如下图所示： ![](https://main.qcloudimg.com/raw/758cfd8b5dba9d202a47363d8a19caf5.png) >!如果以上设置都正确，但小程序依然不能正常工作，可能是微信内部的缓存没更新，请删除小程序并重启微信后，再进行尝试。

属性定义

属性名 类型 默认值 说明
url String - 用于音视频上行的推流 URL
mode String RTC SD，HD，FHD，RTC
autopush Boolean false 是否自动启动推流
muted Boolean false 是否静音
enable-camera Boolean true 开启\关闭摄像头
auto-focus Boolean true 手动\自动对焦
orientation String vertical vertical，horizontal
beauty Number 0 美颜指数，取值 0 - 9，数值越大效果越明显
whiteness Number 0 美白指数，取值 0 - 9，数值越大效果越明显
aspect String 9：16 3：4，9：16
zoom Boolean false 是否正常焦距，true 表示将摄像头放大
device-position String front front 前置摄像头，back 后置摄像头
min-bitrate Number 200 最小码率，该数值决定了画面最差的清晰度表现
max-bitrate Number 1000 最大码率，该数值决定了画面最好的清晰度表现
audio-quality String low low 适合语音通话，high 代表高音质
waiting-image String - 当微信切到后台时的垫片图片
waiting-image-hash String - 当微信切到后台时的垫片图片的校验值
background-mute Boolean false 当微信切到后台时是否禁用声音采集
bindstatechange String - 用于指定一个 javascript 函数来接收音视频事件
debug Boolean false 是否开启调试模式

示例代码

<view id='video-box'>  
    <live-pusher
          id="pusher"
          mode="RTC"
          url="{{pusher.push_url}}" 
          autopush='true'
          bindstatechange="onPush">
    </live-pusher>  
 </view>

属性详解

  • url 用于音视频上行的推流 URL，以 rtmp:// 协议前缀开头，腾讯云推流 URL 的获取方法见 快速获取 URL 文档。

?小程序内部使用的 RTMP 协议是支持 UDP 加速的版本，在同样网络条件下，UDP 版本的 RTMP 会比开源版本的有更好的上行速度和抗抖动能力。

  • mode SD、HD 和 FHD 主要用于直播类场景，例如赛事直播、在线教育、远程培训等等。SD、HD 和 FHD 分别对应三种默认的清晰度。该模式下，小程序会更加注重清晰度和观看的流畅性，不会过分强调低延迟，也不会为了延迟牺牲画质和流畅性。

RTC 则主要用于双向视频通话或多人视频通话场景，例如金融开会、在线客服、车险定损、培训会议等。该模式下，小程序会更加注重降低点到点的时延，也会优先保证声音的质量，在必要的时候会对画面清晰度和画面的流畅性进行一定的缩水。

  • orientation 和 aspect 横屏（horizontal）模式还是竖屏（vertical）模式，默认是竖屏模式，即 home 键朝下。这时，小程序推出的画面的宽高比是3：4或者9 : 16这两种竖屏宽高比的画面，也就是宽 < 高。如果改成横屏模式，小程序推出的画面宽高比即变为4 : 3或者16 : 9这种横屏宽高比的画面，也就是宽 > 高。

具体的宽高比是由 aspect 决定的 ，默认是9：16，也可以支持3：4。这是在 orientation 的属性值为 vertical 的情况下。如果 orientation 的属性值为 horizontal，那么3：4的效果等价于4：3，9：16的效果等价于16：9。

  • min-bitrate 和 max-bitrate 这里首先要科普一个概念 —— 视频码率，指视频编码器每秒钟输出的视频数据的多少。在视频分辨率确定的情况下，视频码率越高，即每秒钟输出的数据越多，相应的画质也就越好。

所以 min-bitrate 和 max-bitrate 这两个属性，分别用于决定输出画面的最低清晰度和最高清晰度。这两个数值并非越大越好，因为用户的网络上行不是无限好的。但也不是越小越好，因为实际应用场景中，清晰与否是用户衡量产品体验的一个重要指标。具体的数值设定我们会在 参数设置 部分详细介绍。

小程序内部会自动处理好分辨率和码率的关系，例如2Mbps的码率，小程序会选择720p的分辨率进行匹配，而300kbps的码率下，小程序则会选择较低的分辨率来提高编码效率。所以您只需要关注 min-bitrate 和 max-bitrate 这一对参数就可以掌控画质。

  • waiting-image 和 waiting-image-hash 出于用户隐私的考虑，在微信切到后台以后，小程序希望停止摄像头的画面采集。但是对于另一端的用户而言，画面会变成黑屏或者冻屏（停留在最后一帧），这种体验是非常差的。为了解决这个问题，我们引入了 waiting-image 属性，您可以设置一张有 “稍候” 含义的图片（waiting-image 是该图片的 URL，waiting-image-hash 则是该图片对应的 md5 校验值）。当微信切到后台以后，小程序会使用该图片作为摄像头画面的替代，以极低的流量占用维持视频流3分钟时间。

  • debug 调试音视频相关功能，如果没有很好的工具会是一个噩梦，所以小程序为 live-pusher 标签支持了 debug 模式，开始 debug 模式之后，原本用于渲染视频画面的窗口上，会显示一个半透明的 log 窗口，用于展示各项音视频指标和事件，降低您调试相关功能的难度，具体使用方法我们在 FAQ 中有详细说明。

参数设置

这么多参数，具体要怎样设置才比较合适，我们给出如下建议值：

| 场景 | mode | min-bitrate | max-bitrate | audio-quality | 说明 | |-------------|:-------:| :-------------: | :-------:| :--------: | ------------ -| | 标清直播 | SD | 300kbps | 800kbps | high | 窄带场景，例如户外或者网络不稳定的情况下适用 | | 高清直播 | HD | 600kbps | 1200kbps | high | 目前主流的 App 所采用的参数设定，普通直播场景推荐使用这一档 | | 超清直播 | FHD | 600kbps | 1800kbps | high | 对清晰度要求比较苛刻的场景，普通手机观看使用 HD 即可 | | 视频客服（用户） | RTC | 200kbps | 500kbps | high | 这是一种声音为主，画面为辅的场景，所以画质不要设置的太高 | | 车险定损（车主） | RTC | 200kbps | 1200kbps | high | 由于可能要看车况详情，画质上限会设置的高一些 | | 多人会议（主讲） | RTC | 200kbps | 1000kbps | high | 主讲人画质可以适当高一些，参与的质量可以设置的低一些 | | 多人会议（参与） | RTC | 150kbps | 300kbps | low | 作为会议参与者，不需要太高的画质和音质 |

?如果不是对带宽特别没有信心的应用场景，audio-quality 选项请不要选择 low，其音质和延迟感都会比 high 模式差很多。

对象操作

参数 说明
wx.createLivePusherContext() 通过 wx.createLivePusherContext() 可以将 <live-pusher> 标签和 javascript 对象关联起来，之后即可操作该对象
start 开始推流，如果 <live-pusher> 的 autopush 属性设置为 false（默认值），那么就可以使用 start 来手动开始推流
stop 停止推流
pause 暂停推流
resume 恢复推流，请与 pause 操作配对使用
switchCamera 切换前后摄像头
snapshot 推流截图，截图大小跟组件的大小一致。截图成功图片的临时路径为 ret.tempImagePath 
var pusher = wx.createLivePusherContext('pusher');
pusher.start({
    success: function(ret){
            console.log('start push success!')
        }
        fail: function(){
            console.log('start push failed!')
        }
        complete: function(){
            console.log('start push complete!')
        }
});

内部事件

通过 <live-pusher> 标签的 bindstatechange 属性可以绑定一个事件处理函数，该函数可以监听推流模块的内部事件和异常通知。

常规事件

code 事件定义 含义说明
1001 PUSH_EVT_CONNECT_SUCC 已经成功连接到云端服务器
1002 PUSH_EVT_PUSH_BEGIN 与服务器握手完毕，一切正常，准备开始上行推流
1003 PUSH_EVT_OPEN_CAMERA_SUCC 已成功启动摄像头，摄像头被占用或者被限制权限的情况下无法打开

严重错误

code 事件定义 含义说明
-1301 PUSH_ERR_OPEN_CAMERA_FAIL 打开摄像头失败
-1302 PUSH_ERR_OPEN_MIC_FAIL 打开麦克风失败
-1303 PUSH_ERR_VIDEO_ENCODE_FAIL 视频编码失败
-1304 PUSH_ERR_AUDIO_ENCODE_FAIL 音频编码失败
-1305 PUSH_ERR_UNSUPPORTED_RESOLUTION 不支持的视频分辨率
-1306 PUSH_ERR_UNSUPPORTED_SAMPLERATE 不支持的音频采样率
-1307 PUSH_ERR_NET_DISCONNECT 网络断连，且经三次重连无效，可以放弃，更多重试请自行重启推流

警告事件

内部警告并非不可恢复的错误，小程序内部的音视频 SDK 会启动相应的恢复措施，警告的目的主要用于提示开发者或者最终用户，例如：

  • PUSH_WARNING_NET_BUSY 上行网速不给力，建议提示用户改善当前的网络环境，例如让用户离家里的路由器近一点，或者切到 Wi-Fi 环境下再使用。

  • PUSH_WARNING_SERVER_DISCONNECT 请求被后台拒绝，出现这个问题一般是由于 URL 里的 txSecret 计算错，或者是 URL 被其他人占用（跟播放不同，一个推流 URL 同时只能有一个用户使用）。

  • PUSH_WARNING_HANDUP_STOP 当用户单击小程序右上角的圆圈或者返回按钮时，微信会将小程序挂起，此时 <live-pusher> 会抛出5000这个事件。

code 事件定义 含义说明
1101 PUSH_WARNING_NET_BUSY 上行网速不够用，建议提示用户改善当前的网络环境
1102 PUSH_WARNING_RECONNECT 网络断连，已启动重连流程（重试失败超过三次会放弃）
1103 PUSH_WARNING_HW_ACCELERATION_FAIL 硬编码启动失败，自动切换到软编码
1107 PUSH_WARNING_SWITCH_SWENC 由于机器性能问题，自动切换到硬件编码
3001 PUSH_WARNING_DNS_FAIL DNS 解析失败，启动重试流程
3002 PUSH_WARNING_SEVER_CONN_FAIL 服务器连接失败，启动重试流程
3003 PUSH_WARNING_SHAKE_FAIL 服务器握手失败，启动重试流程
3004 PUSH_WARNING_SERVER_DISCONNECT RTMP 服务器主动断开，请检查推流地址的合法性或防盗链有效期
3005 PUSH_WARNING_READ_WRITE_FAIL RTMP 读/写失败，将会断开连接
5000 PUSH_WARNING_HANDUP_STOP 小程序被用户挂起，停止推流

示例代码

Page({
    onPush: function(ret) {
        if(ret.detail.code == 1002) {
                console.log('推流成功了',ret);
        }
    },
    
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
    //...
    }
})