移动端Html5支持Hls格式视频播放，创建一个新的文件命名为VideoPlayerDemo-Html5.html打开

该文件写入如下内容，保存文件将该文件放到移动端（例如Android手机）直接打开可观看视频，

如图1所示。

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>HTML5播放视频</title>

</head>

<body>

<video width="" height="" controls>

  <source src="http://live.hkstv.hk.lxdns.com/live/hks/playlist.m3u8" type="application/vnd.apple.mpegurl">

  浏览器不支持 video 标签。

</video>

</body>

</html

图1Html5 播放Hls效果图

交流群号为1038388075，766718184 ，博主提供Ffmpeg、GB28181视频教程 播放地址： http://www.iqiyi.com/u/1426749687

视频下载地址：http://www.chungen90.com/?news_3/

Html5 播放Hls格式视频的更多相关文章

  1. vue 使用vue-video-player播放hls格式视频

    安装 vue-video-player   在 “ devDependencies ” 中 安装  videojs-contrib-hls 在“ dependencies ”中   main.js 中 ...

  2. 前端播放m3u8格式视频

    一.前端播放m3u8格式视频 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta chars ...

  3. opencv实例三：播放AVI格式视频

    一.不带滚动条的视频读取播放. 1.原理介绍:视频的本质是一些静态的图像的集合,opencv可以不断读取视屏中的图片,显示,就可以实时的视频流进行处理了. 2.代码如下: /************* ...

  4. Html 播放 mp4格式视频提示 没有发现支持的视频格式和mime类型

    转自原文 Html 播放 mp4格式视频提示 没有发现支持的视频格式和mime类型 播放mp4格式的时候提示 Html 播放 mp4格式视频提示 没有发现支持的视频格式和mime类型 原因是在IIS中 ...

  5. 在vue项目中播放m3u8格式视频

    前言:最近公司在做一个线上会议的项目,要求后台网站播放m3u8格式的视频,查找部分资料,总结一下,方便后边查阅 1.在vue工程中安装以下依赖: cnpm install  video.js --sa ...

  6. 百度播放器SDK 播放MP4格式视频有声音无画面问题解决

    此处为记录解决过程. 所链接使用的MP4格式视频为codec id是mp4v-20.使用手机自带播放器可以播放,使用百度云媒体播放器不能无画面.经调试,Android Baidu-Cloud-Play ...

  7. C#用ckplayer.js播放 MP4格式视频实现 边加载边播放

    MVC设计模式下 在View页面里面使用ckplayer.js 加载视频 ,在MP4格式视频上传之后 我发现某些视频可以边加载边播放 但是有一些又不行,找了下原因是因为视频的元数据信息在第一帧的时候就 ...

  8. html5 播放多个视频。一个接一个的播放

    new个video,指定播放列表的第一个视频路径为src.监听end事件,回调里面把video的src改成列表的下一个,再play. 示意代码:var vList = ['视频地址url1', 'ur ...

  9. html页面引用video.js播放m3u8格式视频

    //head里面的内容,我是采用cdn引用的方式,因为项目太小 <head> <meta charset="utf-8" /> <title>二 ...

随机推荐

  1. UVA11806 Cheerleaders (容斥)

    题目链接 Solution 可以考虑到总方案即为 \(C_{nm}^k\) . 考虑到要求的是边缘都必须至少有 \(1\) ,所以考虑不合法的. 第一行和最后一行没有的方案即为 \(C_{(n-1)m ...

  2. swarm 发布服务

    1.发布服务 2.发布服务 服务发现:Swarm模式内置DNS组件,自动为每个服务分配DNS记录,然后服务的DNS名称在集群内的服务直接分发请求.负载均衡:在Swarm集群中创建服务时,Ingress ...

  3. Python matplotlib 柱状图

    matplotlib是python最著名的绘图库,它提供了一整套和matlab相似的命令API,十分适合交互式地进行制图.而且也可以方便地将它作为绘图控件,嵌入GUI应用程序中.它的文档相当完备,并且 ...

  4. ClassLoader 提供了两个方法用于从装载的类路径中取得资源：

    转:http://cheneyph.iteye.com/blog/831721 ClassLoader 提供了两个方法用于从装载的类路径中取得资源: public URL  getResource ( ...

  5. 洛谷P2168 荷马史诗 [NOI2015]

    题目描述 追逐影子的人,自己就是影子 ——荷马 Allison 最近迷上了文学.她喜欢在一个慵懒的午后,细细地品上一杯卡布奇诺,静静地阅读她爱不释手的<荷马史诗>.但是由<奥德赛&g ...

  6. 背景.jpg

  7. locust性能测试(无 web ui 模式)

    前言 前面是在web页面操作,需要手动的点start启动,结束的时候也需要手工去点stop,没法自定义运行时间,这就不太方便.locust提供了命令行运行的方法,不启动web页面也能运行,这就是no- ...

  8. 对/proc和/sys的一些理解

    一切皆文件,设备(文件)可以通过读写来操作:/proc procfs:/sys sysfs: 个人的理解(不知对不对,感觉有些片面)/proc是内存中有关系统进程的实时信息:/sys是有关系统内核以及 ...

  9. C#图片转成流，流转成图片，字节转图片，图片转字节的方法

    图片转成流 Bitmap b = new Bitmap(Server.MapPath(ppath)); Stream ms = new MemoryStream(); b.Save(ms, Syste ...

  10. ios圆角优化-不掉帧

    因网络图片加载用的是SDWebImage所以下面以sd加载图片为例 //普通的加载网络图片方式(已不能满足需求,需要改进) [self sd_setImageWithURL:url placehold ...