微信项目直播开发（二）

在（一）中获取到播放地址，可直接在我们微信的项目中播放直播。

php控制器方法判断访问来自ios/安卓/电脑.

// 判断
 	if(strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone')||strpos($_SERVER['HTTP_USER_AGENT'], 'iPad')){
     // echo 'ios';
       
      }else if(strpos($_SERVER['HTTP_USER_AGENT'], 'Android')){
     // echo 'Android';
      
      }else{
      // echo 'other';
     
      }
   

根据控制器方法判断来显示页面。

iOS端

src选取播放地址中的HLS

//1.body内容
<video id="myPlayer" >
  <source src="" type="application/x-mpegURL"/>
</video>

//2.引入微信js内容
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> 

//3.在JS中监听，自动播放
document.addEventListener("WeixinJSBridgeReady", function () { 
        document.getElementById('myPlayer').play(); 
    }, false); 

安卓端

//  src选择播放地址中的rmtp
<video id="ipcStreamVideo" controls="controls" autoplay="true" x-webkit-airplay="allow" webkit-playsinline>        
<source src=""type="application/vnd.apple.mpegurl"/>       
</video> 

电脑浏览器访问

// 1.引入文件
<link href="https://vjs.zencdn.net/7.8.4/video-js.css" rel="stylesheet"> 
<script src="https://vjs.zencdn.net/7.8.4/video.js"> </script> 
<script src="https://cdn.jsdelivr.net/npm/videojs-flash@2/dist/videojs-flash.min.js"></script> 

// 2.src选择播放地址中的rmtp
<video id="my-player" data-setup='{}' class="video-js" autoplay='true'muted='true'>
<source src="" id="my-source" type="rtmp/flv"></source>
<p class="vjs-no-js">浏览器不支持，请更换最新浏览器</p>
</video>

// 3.js
	var nrl = window.location.search;
    console.log('rtmp frame page location search:', nrl);
    if (nrl) {
      var srl = nrl.substring(5);
      var mw = window.innerWidth
      var mh = window.innerHeight
      console.log('home url w-h:', mw, mh)
      var myer = videojs('my-player')
      myer.width(mw)
      myer.height(mh)
      myer.src({ type: 'rtmp/flv', src: srl})
      setTimeout(() => {
        console.log('in time out srl:', srl)
        myer.play()
      }, 300);
    }