解决微信小程序实时视频、直播插件 主播意外掉线再进入,观众端卡住断流,无法刷新的问题

观众端:

<live-player src="https://domain/pull_stream" mode="RTC" autoplay bindstatechange="statechange" binderror="error" style="width: 300px; height: 225px;" id="video-livePlay"/>
  statechange(e) {
    console.log('live-player code:', e.detail.code)
  },
  error(e) {
    console.error('live-player error:', e.detail.errMsg)
  }

主播退出或掉线,statechange事件打印出:-2301

开发文档中状态码
-2301 网络断连,且经多次重连抢救无效,更多重试请自行重启播放

其实在当拉取不到流量时,页面也会自行进行大约3次重新连接,但是次数少,时间短。现在我们想让它多刷新些时候。

闯入误区:

	let layerContext = wx.createLivePlayerContext('video-livePlay');

此时后面的 layerContext.play();是无论如何都不运行的,闹心啊!刺挠啊!

layerContext.stop({
	success: function() {
		layerContext.play();
	},
	fail: function() {
		console.log('stop failed!')
	}
})

解决问题:

在这里插入图片描述

正确源码:

划重点啦: 加个this
wx.createLivePlayerContext(‘video-livePlay’, this);

	statechange(e) {
			let layerContext = wx.createLivePlayerContext('video-livePlay', this);
			switch (e.detail.code) {
				case -2301:
					// 恢复拉流的画面  (先停止再重新播放渲染)
					layerContext.stop({
						success: function() {
							layerContext.play();
						},
						fail: function() {
							console.log('stop failed!')
						}
					})
					//判断 观众自个儿 是否断网
					wx.getNetworkType({
						success: res => {
							if (res.networkType != "none") {  //是主播网络异常或主播异常退出
								wx.showToast({
									title: '主播跑丢了',
									icon: 'loading',
									duration: 2000
								})
							} else { //观众自个儿的网络异常
								wx.showToast({   
									title: '请检查你的网络连接是否正常',
									icon: 'loading',
									duration: 2000
								})
							}
						}
					})
					break;
				default:
					break;
			}
		}
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值