1. 程式人生 > >使用video.js庫播放rtmp視訊流

使用video.js庫播放rtmp視訊流

轉載地址:https://blog.csdn.net/u013654125/article/details/78813501

參考:https://www.cnblogs.com/ShaYeBlog/p/7068188.html

在h5頁面裡播放rtmp流,需要一個viode.js庫的支援。當前video.js庫已經出到了6.x版本。但是6.x版本播放不了rtmp流。所以示例中只用了5.5.3版本的庫。

<!DOCTYPE HTML>
<html>  
  <head>  
  <title>視訊直播</title>  
  <meta charset="utf-8">  
  <link href="http://vjs.zencdn.net/5.5.3/video-js.css" rel="stylesheet">  
  <!-- If you'd like to support IE8 -->  
  <script src="http://vjs.zencdn.net/ie8/1.1.1/videojs-ie8.min.js"></script>  
</head>  
<body>  
  <h1>直播測試</h1>  
 <video id="my-video" class="video-js" controls preload="auto" width="640" height="300"  
 poster="" data-setup="{}">  
    <source src="rtmp://10.168.4.37:10935/hls/stream_1" type="rtmp/flv">  
    <p class="vjs-no-js">播放視訊需要啟用 JavaScript,推薦使用支援HTML5的瀏覽器訪問。  
      To view this video please enable JavaScript, and consider upgrading to a web browser that  
      <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>  
    </p>  
 </video>  
 <script src="http://vjs.zencdn.net/5.5.3/video.js"></script>  
</body>  
</html> 

把source中的地址換成自己的地址測試可用。