前端播放flv格式视频的播放器

熊猫在哪

已于 2023-11-28 09:17:24 修改

阅读量671

点赞数 11

分类专栏：前端文章标签：前端音视频 javascript html5

于 2023-11-27 17:52:03 首次发布

本文链接：https://blog.csdn.net/pandafucker/article/details/134651035

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

使用flv.js库

<html>
    <head>
        <script src="https://cdn.bootcdn.net/ajax/libs/flv.js/1.5.0/flv.min.js"></script>
    </head>
    <body>
        <video id="videoElement" controls autoplay width="100%" height="100%" muted></video>
        <script>
            var videoElement = document.getElementById('videoElement');
            var flvPlayer = flvjs.createPlayer({
                type: 'flv',
                isLive: true,
                url: 'http://172.18.99.149:85/live/STREAM_NAME.flv',  
            });
            flvPlayer.attachMediaElement(videoElement);
            flvPlayer.load();
            flvPlayer.play();
        </script>
    </body>
</html>

需要注意的是，如果video标签不加上muted(静音)属性，自动播放可能会在某些浏览器下失效，比如chrome，不要忘了。