使用手机H5设备推流

现存问题: 1.直播间观看的视频数据流一直在循环播放,而不是根据时间向前推进. 2.播放视频需要好长时间转换才能观看.

 

直播端设置

1、在页面插入按钮、视频播放器元素、浏览器直播元素、同步数据元素,如下图:

2、在视频播放器元素上进行属性绑定和绑定变量初始化,如下图:

绑定参数:{"data--vsrc":source}

绑定变量初始化:{"source":""}

3、开始按钮的id设置为start,同时对此按钮进行绑定数据编程,如下图:

绑定数据编程中的高级编辑:_vm.state("start");

4、停止按钮的id设置为stop,同时对此按钮进行绑定数据编程(同上)。

绑定数据编程中的高级编辑:_vm.state("stop");

5、在浏览器直播元素上设置id为test,name为webcamchunk;同时进行属性绑定和绑定变量初始化,如下图:

绑定参数:{"data--state":state,"data--camera":camera,"data-x-source":source,"data-x-datacount":datacount,"data-x-liveid":liveid,"data-studioid":studioid,"data-livevideoid":"vjs_video_1_html5_api"} ;studioid是由后端返回的直播间的id。

绑定变量初始化:{"camera":0,"source":""}

6、设置同步数据元素,如下图:

  • 需要提交的元素:#test
  • 需要提交的页面数据层的变量:datacount
  • 监听变量:datacount
播放端设置

播放端为观众观看直播的页面,需要在页面插入播放器元素并在其设置中开启直播功能,如下图: