【Vue】直播流m3u8,rtsp,rtmp,flv,mp4测试地址

原作者地址:m3u8,rtsp,rtmp,flv,mp4直播流在线测试地址(2022年8月)

前端做直播视频展示的时候,很多时候播放不出来,不是因为自己代码的问题,而是因为网上很多源视频流现在已经播放不出来了,所以源头都有问题,那自己的前端肯定就放不出来。

一、测试工具使用

可以自己下载potplayer这个软件,测试视频流是否可用。下载链接如下:Download PotPlayer

具体使用方法如下:

在软件屏幕上右击,然后选择【打开】–> 【打开链接】

在这里插入图片描述

然后在上方输入在线测试的链接,然后点击【确定】

在这里插入图片描述

如果当前在线链接可以用,就会播放出视频,否则的话就会报错,如下图,就知道当前的视频流不可用了。


在线测试地址

1. m3u8:

湖南卫视直播:http://219.151.31.38/liveplay-kk.rtxapp.com/live/program/live/hnwshd/4000000/mnf.m3u8
计时器:http://playertest.longtailvideo.com/adaptive/bipbop/gear4/prog_index.m3u8

2. rtsp

rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mp4

3. rtmp

伊拉克 Al Sharqiya 电视台: rtmp://ns8.indexforce.com/home/mystream

韩国GOOD TV: rtmp://mobliestream.c3tv.com:554/live/goodtv.sdp

4. flv


西瓜播放器测试视频: https://sf1-hscdn-tos.pstatp.com/obj/media-=fe/xgplayer_doc_video/flv/xgplayer-demo-360p.flv

5. MP4

http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4
http://vjs.zencdn.net/v/oceans.mp4
https://media.w3.org/2010/05/sintel/trailer.mp4

  • 1
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue.js是一个行的JavaScript框架,用于构建用户界面。它提供了一种简洁、灵活的方式来开发交互式的Web应用程序。而m3u8是一种常用的视频媒体格式,通常用于在Web上播放视频。 要在Vue.js中播放m3u8视频,你可以使用video.js这个行的HTML5视频播放器库。video.js提供了丰富的功能和易于使用的API,可以轻松地集成到Vue.js应用程序中。 首先,你需要在你的Vue.js项目中安装video.js。你可以使用npm或yarn来安装它: ``` npm install video.js ``` 或者 ``` yarn add video.js ``` 安装完成后,你可以在Vue组件中引入video.js并使用它来播放m3u8视频。下面是一个简单的示例: ```vue <template> <div> <video ref="videoPlayer" class="video-js"></video> </div> </template> <script> import videojs from 'video.js'; import 'video.js/dist/video-js.css'; export default { mounted() { // 创建video.js实例 this.player = videojs(this.$refs.videoPlayer, { techOrder: ['html5'], sources: [{ src: 'path/to/your/m3u8/file.m3u8', type: 'application/x-mpegURL' }] }); }, beforeDestroy() { // 销毁video.js实例 if (this.player) { this.player.dispose(); } } }; </script> <style> .video-js { width: 100%; height: 100%; } </style> ``` 在上面的示例中,我们在Vue组件的`mounted`钩子函数中创建了一个video.js实例,并将m3u8视频文件作为源添加到播放器中。在组件销毁之前,我们需要在`beforeDestroy`钩子函数中销毁video.js实例,以避免内存泄漏。 这只是一个简单的示例,你可以根据自己的需求进行更多的定制和配置。你还可以使用video.js提供的丰富的API来控制视频播放、添加自定义样式等。 希望这个简单的示例能够帮助你开始在Vue.js中播放m3u8视频。如果你有任何进一步的问题,请随时提问。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值