网页播放RTMP码流及遇到无法播放，自动播放的问题

最新推荐文章于 2021-05-10 09:35:08 发布

DrBlack666

最新推荐文章于 2021-05-10 09:35:08 发布

阅读量2.1k

点赞数

分类专栏： web开发 JS前端开发

本文链接：https://blog.csdn.net/DrBlack666/article/details/103777827

版权

JS前端开发同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

web开发

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>video.js</title>
    <link href="https://unpkg.com/video.js@6.11.0/dist/video-js.min.css" rel="stylesheet">
    <script src="https://unpkg.com/video.js@6.11.0/dist/video.min.js"></script>
    <script src="https://unpkg.com/videojs-flash/dist/videojs-flash.js"></script>
    <script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>
  </head>
  <body>
    <video id="my-player" class="video-js" ">
        <source src="rtmp://10.1.3.10:1935/myapp/stream-name" type="rtmp/flv">
        <p class="vjs-no-js">
          not support
        </p>
    </video>
    <script type="text/javascript">
      var player = videojs('my-player',{
        width:400,
        heigh:200
      });
    </script>
  </body>
</html>

如果想要打开网页自动播放rtmp码流，去掉界面上的控制按键，则需要修改video视频标签

 <video id="my-player" class="video-js" autoplay="autoplay" data-setup="{}">

ps:有些时候video-js插件加载不成功（网络服务器的原因）或者其他原因加载不了，还有一个网络地址可以加载video-js:

    <script src="https://cdn.jsdelivr.net/npm/videojs-flash@2/dist/videojs-flash.min.js"></script>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>

DrBlack666

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
网页播放RTMP码流及遇到无法播放，自动播放的问题

<!DOCTYPE html><html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>video.js</title> <link href="https://unpkg.com/[email protected]/dist...
复制链接

扫一扫