http-flv实现无插件视频直播+实现视频切换

1.根据layui的树形结构拿到所点击的ID,通过angular调用方法

 tree.render({
     elem: '#device'
    ,data: data1
    ,isJump: true  
    ,click: function(obj){
      var data = obj.data;  //获取当前点击的节点数据
      var tree_id=  JSON.stringify(data.id); 
      //通过controller来获取Angular应用
            var appElement = document.querySelector('[ng-controller=videoMonitorController]');
            //获取$scope变量
            var $scope = angular.element(appElement).scope(); 
            $scope.video_tree(tree_id);
    }

2.进入angular进行方法的请求处理然后进行回调视频

    $scope.video_tree= function($event){  
    $http({
        method: "GET",
        url: "/platform/video_model/cameraSwitch",
        params: {name: $event}
        }).then(function(resp){ 
            //layer.closeAll('loading');
            layer.msg("切换成功!"); 
            videoLive();
        });
    }; 

3.进行flv视频处理

function videoLive(){ 
    if (flvjs.isSupported()) {
        var rtmpVideo = document.getElementById('rtmpVideo');
        var flvPlayer = flvjs.createPlayer({
            type: 'flv',
            isLive: true,
            cors: true,   
            hasAudio: false,  
            hasVideo: true, 
            enableStashBuffer: true, 
            url: '自己的推流路径'
        });
        flvPlayer.attachMediaElement(rtmpVideo);
        flvPlayer.load();
        flvPlayer.play();
        rtmpVideo.onwaiting = function(){ 
            document.getElementById("rtmpVideo").poster="static/img/lod/1.gif"
        }; 
    }else{
        layer.msg("播放失败"); 
    }
     
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值