在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. Redis击穿、穿透、雪崩产生原因以及解决思路

    击穿 大家都知道,计算机的瓶颈之一就是IO,为了解决内存与磁盘速度不匹配的问题,产生了缓存,将一些热点数据放在内存中,随用随取,降低连接到数据库的请求链接,避免数据库挂掉.需要注意的是,无论是击穿还是 ...

  2. XCTF-基础Android

    前期工作 查壳,无.打开看是普通的输入注册码然后验证. 逆向分析 这题太简单了,就不贴图了.看Manifest得知MainActivity是启动类,也就是点进去输入注册码那个类.密码不重要,验证成功后 ...

  3. Grafana Prometheus系统监控Redis服务

    Grafana Prometheus系统监控Redis服务 一.Grafana Prometheus系统监控Redis服务 1.1流程 1.2安装redis_exporter 1.3配置prometh ...

  4. 封装SpringJdbcTemplate

    package com.jy.modules.cms.query; import java.util.List; import java.util.Map; public interface quer ...

  5. linux 高可用----keepalived+lvs

    什么是高可用? HA(high availability)即高可用性:就是在高可用集群中发生单点故障时,能够自动转移资源并切换服务,以保证服务一直在线的机制. LVS LVS:(linux virtu ...

  6. 最短路-SPFA算法&Floyd算法

    SPFA算法 算法复杂度 SPFA 算法是 Bellman-Ford算法 的队列优化算法的别称,通常用于求含负权边的单源最短路径,以及判负权环. SPFA一般情况复杂度是O(m)最坏情况下复杂度和朴素 ...

  7. 腾讯云TcaplusDB获新加坡MTCS最高等级安全认证

    近日,经过国际权威认证机构DNV GL的全面评估审核,TcaplusDB获得了新加坡多层云安全(以下简称"MTCS")T3级最高等级认证,这标志着TcaplusDB全面满足了新加坡 ...

  8. 如何学习Java?从标识符开始

    标识符 1.定义 Java对各种变量.方法和类等要素命名时使用的字符序列称为标识符(包含但不限于:类名.变量名.方法名.接口名.包名--) 2.命名规则 1.由26个英文字母大小写,0-9,_或$组成 ...

  9. 正点原子DS100拆解全过程-硬件工程师必备

    前言: 之前一篇只针对正点原子DS100手持示波器的使用介绍文章.可作为一个电子工程师,光使用不是我们的风格哈,我们还要拆开看看电路. 开拆 外壳 首先,看下图,DS100不是使用螺母进行固定的,而是 ...

  10. Codeforces Round #625 (Div. 2, based on Technocup 2020 Final Round) D. Navigation System(有向图,BFS,最短路)

    题意: n 点 m 边有向图,给出行走路径,求行走途中到路径终点最短路变化次数的最小值和最大值 . 思路 : 逆向广搜,正向模拟. #include <bits/stdc++.h> usi ...