要在HTML頁(yè)面中使用Video.js播放RTMP流媒體,需要使用videojs-contrib-media-sources插件和videojs-flash插件。以下是一個(gè)示例代碼:
<!DOCTYPE html>
<html>
? <head>
? ? <link rel="stylesheet">
? ? <script src="http://vjs.zencdn.net/7.14.3/video.js"></script>
? ? <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-media-sources/6.7.0/videojs-contrib-media-sources.min.js"></script>
? ? <script src="http://cdnjs.cloudflare.com/ajax/libs/videojs-flash/2.1.0/videojs-flash.min.js"></script>
? </head>
? <body>
? ? <video id="my-video" class="video-js vjs-default-skin" controls preload="auto" width="640" height="480">
? ? ? <source src="" type='video/flv'>
? ? </video>
? ? <script>
? ? ? var player = videojs('my-video', {
? ? ? ? techOrder: ['flash', 'html5'],
? ? ? ? sources: [{
? ? ? ? ? src: 'rtmp://your_rtmp_url',
? ? ? ? ? type: 'rtmp/flv'
? ? ? ? }]
? ? ? });
? ? </script>
? </body>
</html>
請(qǐng)將your_rtmp_url
替換為實(shí)際的RTMP流媒體地址。
在這個(gè)示例代碼中,我們首先導(dǎo)入了video.js的CSS和JS文件,以及videojs-contrib-media-sources插件和videojs-flash插件的JS文件。然后,在<video>
標(biāo)簽中添加了一個(gè)空的<source>
標(biāo)簽,稍后將通過(guò)JavaScript代碼設(shè)置其源地址和類型。接下來(lái),通過(guò)JavaScript代碼初始化video.js播放器并配置使用Flash技術(shù)作為首選技術(shù)進(jìn)行播放。文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-717869.html
注意,使用Flash播放RTMP流需要瀏覽器支持Flash插件,并且可能受到防火墻或其他網(wǎng)絡(luò)限制的影響。文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-717869.html
到了這里,關(guān)于Video.js實(shí)現(xiàn)在html頁(yè)面播放rtmp流媒體的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!