javascript 使用VideoJS或类似工具播放IPTV直播电视流

jtw3ybtb 于 2023-05-12 发布在 Java

关注(0)|答案(2)|浏览(137)

我正在尝试用videojs播放直播电视频道。我已经尝试了各种方法，但总是得到“没有兼容的来源被发现为这个媒体。”错误。其他视频播放正常。
url在VLC中播放良好，编解码器将流显示为“MPEG-H Part2/HEVC（H.265）（hevc）”。
我也试过各种浏览器，chrome，firefox，safari和edge。
这是代码的基本部分。有办法玩吗？

<link href="https://vjs.zencdn.net/7.17.0/video-js.css" rel="stylesheet" />
<script src="https://vjs.zencdn.net/7.17.0/video.min.js"></script>
<script src="https://unpkg.com/videojs-contrib-dash/dist/videojs-dash.js"></script>
<script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>

<video id='live-video' class='video-js vjs-default-skin' controls>
</video>

<script>
  var player = videojs('live-video');
  player.src({ src:'https://www.example.com/play.php?OTUxE2NDUN', type:'application/x-mpegurl'});
  player.play();
</script>

JavaScript

来源：https://stackoverflow.com/questions/71228784/playing-a-iptv-live-tv-stream-with-videojs-or-similar

2条答案

按热度按时间

s3fp2yjn1#

我的结论是，你在基本帖子（问题）中显示的编码没有任何问题。我推测你使用的实际源URL不是一个有效的HLS流，因此导致了你所说的错误。（它可能是一个有效的DASH流，但我有理由肯定你的代码不能使用DASH流。
下面是一些与您的代码等效的工作代码，除了它使用了Video.js live教程中提到的较新（推荐）的UI / API。下面的代码为什么能工作的关键是它引用了一个有效的HLS流...（我在互联网上偶然发现的URL）。

<!DOCTYPE html>
<html>
<head>
<script src="https://vjs.zencdn.net/7.17.0/video.min.js"></script>
<link href="https://vjs.zencdn.net/7.17.0/video-js.css" rel="stylesheet" />
<!--  [ Note:  HLS code is "built-in" to video.js, as of version 4.x, so we should NOT include (possibly older?) HLS support separately ]  -->
<!--   script src="https://unpkg.com/videojs-contrib-dash/dist/videojs-dash.js"></script  -->
<!--   script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script -->
</head>

<video id='live-video' class='video-js   vjs-default-skin    vjs-live  vjs-liveui'    width='640' height='360'  controls  muted>
</video>

<script>
// The extra 'liveui' arg below, and two extra classnames are not REQUIRED, but documentation-tutorial
// refers to it as the newer/preferred API    See:  https://docs.videojs.com/tutorial-live.html
   var  player = videojs('live-video', {liveui: true} );
   player.src({ src:'https://live.alarabiya.net/alarabiapublish/alarabiya.smil/playlist.m3u8', type:'application/x-mpegurl'});
   // Note: We begin with the stream playing, but the audio is initially 'muted' (see that attribute in video tag above )
   //   See:   https://stackoverflow.com/questions/70719678/html5-video-autoplay-with-sound-unmuted
   player.play();
  
  /*   Note: Their "playlist.m3u8" file in their URL contains these lines (this info helps us understand the goal of their HLS)
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-STREAM-INF:BANDWIDTH=2130537,RESOLUTION=1920x1080,CODECS="avc1.4d4028,mp4a.40.2",CLOSED-CAPTIONS=NONE
alarabiapublish/alarabiya_1080p/chunks.m3u8
#EXT-X-STREAM-INF:BANDWIDTH=1292733,RESOLUTION=1280x720,CODECS="avc1.4d401f,mp4a.40.2",CLOSED-CAPTIONS=NONE
alarabiapublish/alarabiya_720p/chunks.m3u8
#EXT-X-STREAM-INF:BANDWIDTH=557217,RESOLUTION=640x360,CODECS="avc1.77.30,mp4a.40.2",CLOSED-CAPTIONS=NONE
alarabiapublish/alarabiya_360p/chunks.m3u8
#EXT-X-STREAM-INF:BANDWIDTH=418515,RESOLUTION=426x240,CODECS="avc1.42c015,mp4a.40.2",CLOSED-CAPTIONS=NONE
alarabiapublish/alarabiya_240p/chunks.m3u8
*/
</script>
</body>
</html

赞(0）回复(0）举报 2023-05-12

jpfvwuh42#

这里有一个在网页中播放流视频的简单方法。您可以通过添加video.js网站指南中的参数和代码来自定义它。

<!DOCTYPE html>
<html>
  <head>
    <meta charset=utf-8 />
    <title>UN Web TV</title>
    <link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
    <script src="https://unpkg.com/video.js/dist/video.js"></script>
    <script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js
    </script>
  </head>
  <body>
    <video id="my_video_1" class="video-js vjs-fluid vjs-default-skin" controls preload="auto" data-setup='{}'>
      <source src="https://cdnapi.kaltura.com/p/2503451/sp/250345100/playManifest/entryId/1_gb6tjmle/protocol/https/format/applehttp/a.m3u8" type="application/x-mpegURL">
    </video>
    <script>
      var player = videojs('my_video_1');
      player.play();
    </script>
  </body>
</html>

赞(0）回复(0）举报 2023-05-12

我来回答

javascript 使用VideoJS或类似工具播放IPTV直播电视流

2条答案

相关问题

热门标签

最新问答