在edge上有效

<video width="600" controls>
<source src="https://www.gentaji.com/20200205/2J8Ij9tS/index.m3u8" type="application/x-mpegURL" />
</video>

使用video.js

λ npm install --save @videojs/http-streaming
<link rel="stylesheet" href="./node_modules/video.js/dist/video-js.min.css" />

<video-js id="vid1" class="vjs-default-skin" controls>
<source
src="https://www.gentaji.com/20200205/2J8Ij9tS/index.m3u8"
type="application/x-mpegURL"
/>
</video-js> <script src="./node_modules/video.js/dist/video.min.js"></script> <script>
var player = videojs("vid1");
player.play();
</script>

在浏览器上播放m3u8视频的更多相关文章

  1. 微信 vue中使用video.js播放m3u8视频,解决安卓自动全屏的问题。

    最近一个项目中需要在微信中播放m3u8格式的视频,刚开始用了 vue-video-player 这个插件,在IOS手机体验良好,本以为完事了, 结果安卓手机一点播放就自动全屏,心态略崩.查了资料说是安 ...

  2. H5的video标签在网页上播放MP4视频时只有声音没有画面

    最近做一个项目时,发现mp4文件播放时没有图像,只有声音,代码检查了N次,都没有问题,就算是直接使用网上的实例代码,也只能播放实例视频,mp4文件绝对路径,相对路径也都试了,还是不能播放我的mp4. ...

  3. [转载]为什么有些MP4文件在Chrome浏览器上播放不了?

    http://blog.sina.com.cn/s/blog_6bb7ebcc0101c2ja.html Chrome浏览器支持HTML5,它支持原生播放部分的MP4格式(不用通过Flash等插件). ...

  4. html5播放m3u8视频,web端看直播

    https://github.com/jiqing9006/hLive <!DOCTYPE html> <html> <head> <meta charset ...

  5. html5结合flash实现视频文件在所有主流浏览器兼容播放

    来源:http://blog.csdn.net/freshlover/article/details/7535785/ 由于html5的出现,让网页中的视频.音频有了更加便捷的实现方式.但是video ...

  6. php使用播放插件播放m3u8,mp4,flv格式的视频

    一.这里我主要是播放m3u8的视频,有两款比较好的插件,swise和ckpalyer,我介绍的是ckplayer,这是在pc端播放的,并且是需要flash支持的,不过现在的最新浏览器都是默认安装的 二 ...

  7. chrome播放m3u8視頻失败

    由于项目后台需要播放m3u8视频,但此视频格式在移动端和Safari支持比较友善但是PC浏览器中都不太尽如人意,所以想在Chrome中播放只能借助第三方插件来播放. 有一款Video.js插件极大的简 ...

  8. 【开源技术分享】无需流媒体服务,让浏览器直接播放rtsp/rtmp的神器:EasyMedia

    不同于市面上其他需要各种转发到流媒体服务的中间件来说,EasyMedia不需要依赖任何nginx-rtmp,srs,zlmediakit等等第三方流媒体服务,只需要你有rtsp或者rtmp等等协议的视 ...

  9. PC浏览器播放m3u8

    HLS(HTTP Live Streaming)是苹果公司针对iPhone.iPod.iTouch和iPad等移动设备而开发的基于HTTP协议的流媒体解决方案.在 HLS 技术中 Web 服务器向客户 ...

随机推荐

  1. Java 性能调优的 11 个实用技巧

    大多数开发人员认为性能优化是个比较复杂的问题,需要大量的经验和知识.是的,这并不没有错.诚然,优化应用程序以获得最好的性能并不是一件容易的事情,但这并不意味着你在没有获得这些经验和知识之前就不能做任何 ...

  2. 将字符串进行md5加密

    import java.security.MessageDigest; public class MD5Tools { /** * 将字符串进行md5加密 */ public static Strin ...

  3. java架构《并发编程框架篇 __Disruptor》

    Disruptor入门   获得Disruptor 可以通过Maven或者下载jar来安装Disruptor.只要把对应的jar放在Java classpath就可以了. 基本的事件生产和消费 我们从 ...

  4. Be accepted for inclusion in the IEEE INFOCOM 2018 technical program

    中了一篇INFOCOM,虽然不是一作但也是入学之后一直做的一份工作,算是没白下功夫吧.超声波定位这类工作,老实说,想应用到实际产品中,还是有一段路要走的. 老实说我也一直犹豫毕设的这套东西搞清楚了要不 ...

  5. Flink-v1.12官方网站翻译-P005-Learn Flink: Hands-on Training

    学习Flink:实践培训 本次培训的目标和范围 本培训介绍了Apache Flink,包括足够的内容让你开始编写可扩展的流式ETL,分析和事件驱动的应用程序,同时省略了很多(最终重要的)细节.本书的重 ...

  6. xLua热更新插件

    一.xLua插件下载安装 1.从GitHub上搜索并下载插件 2.将文件复制到unity中 3.检查是否有错误 二.在unity中调用lua 1.简单调用 在c#脚本中使用LuaEnv类可以运行lua ...

  7. 阶段学习总结-坦克大战(2D)案例

    这是前几天学习的案例,这两天学习了NGUI和UGUI,被UI搞得很烦躁,但是今天还是将前几天学习的坦克大战总结以下.这个游戏是小时候的经典红白机游戏的复刻,见截图: 一.游戏物体 游戏中包含地图元素( ...

  8. httprunner(3)用脚手架快速搭建项目

    前言 如何快速搭建一个httprunner项目呢?我们可以使用脚手架,脚手架就是自动地创建一些目录,形成一个项目的架构,不需要我们再手动的去创建 查看创建新项目的命令 先来查看一下帮助命令 httpr ...

  9. Codeforces Round #673 (Div. 2) A. Copy-paste(贪心)

    题目链接:https://codeforces.com/contest/1417/problem/A 题意 给出一个大小为 $n$ 的数组 $a$,每次操作可以选择两个数,然后将一个数加到另一个数上, ...

  10. 郁闷的出纳员 HYSBZ - 1503

    OIER公司是一家大型专业化软件公司,有着数以万计的员工.作为一名出纳员,我的任务之一便是统计每位员工的 工资.这本来是一份不错的工作,但是令人郁闷的是,我们的老板反复无常,经常调整员工的工资.如果他 ...