// 安装依赖
npm i videogular2 --save
npm i hls.js --save // 在index.html中引入
<script src="assets/hls.min.js"></script>
<link href="assets/fonts/videogular.css" rel="stylesheet"> // 在app.modules.ts中引入
import {VgCoreModule} from 'videogular2/core';
import {VgControlsModule} from 'videogular2/controls';
import {VgOverlayPlayModule} from 'videogular2/overlay-play';
import {VgBufferingModule} from 'videogular2/buffering';
import { VgStreamingModule } from 'videogular2/streaming';
...
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
VgCoreModule,
VgControlsModule,
VgOverlayPlayModule,
VgBufferingModule,
VgStreamingModule
],
... // 在html中使用
<vg-player>
<video #myMedia [vgMedia]="media"
[vgHls]="'path-to/v.m3u8'"  // 支持*.mp4类型文件播放
id="my-video"
type="video/mp4"
controls>
</video>
</vg-player>

  

ionic2中使用videogular2实现m3u8文件播放的更多相关文章

  1. vue-video-player集成videojs-contrib-hls实现.m3u8文件播放

    // 安装依赖 npm install vue-video-player --save npm install videojs-contrib-hls --save // 在main.js中全局引入 ...

  2. m3u8文件什么合成便于播放的MP4的方法

    先大家要知道M3U8文件不是一个视频文件,里面全是一些路径,说白了就是一个目录而已,所以要看视频,要找到对应存放视频的文件夹.如果不知道怎么找,可以使用文本格式打开M3U8文件,里面会有路径提示.   ...

  3. m3u8文件简介

    1.   M3U8文件概念 M3U8文件是指UTF-8编码格式的M3U文件.M3U文件是记录了一个索引纯文本文件,打开它时播放软件并不是播放它,而是根据它的索引找到对应的音视频文件的网络地址进行在线播 ...

  4. HLS(HTTP Live Streaming)协议之m3u8文件生成方式

    HLS(HTTP Live Streaming)是Apple的动态码率自适应技术.主要用于PC和Apple终端的音视频服务.包括一个m3u(8)的索引文件,TS媒体分片文件和key加密串文件. HLS ...

  5. m3u8文件信息总结

    近期在做视频下载.本地播放功能的时候.发现的问题,先笔记记录一下 开发思路 (1) 在线解析m3u8文件内容,把里面的ts相应连接的资源下载本地的Document文件下. (2) 把下载下来的资源使 ...

  6. 关于流媒体(m3u8)的播放与下载

    前一段时间做了一个视频播放下载应用,抓取的是优酷的视频,虽然优酷有自己的开发平台http://open.youku.com/,但未真正的实现.所以只能靠抓取视频源,Youku的视频采取了加密+动态的获 ...

  7. HLS的M3U8文件介绍

    HLS的M3U8文件介绍 HLS (HTTP Live Streaming)是Apple的动态码率自适应技术.主要用于PC和Apple终端的音视频服务. 相较于实时传输协议(RTP),HLS可以穿过任 ...

  8. 关于大视频video播放的问题以及解决方案(m3u8的播放)

    在HTML5里,提供了<video>标签,可以直接播放视频,video的使用很简单: <video width="320" height="240&qu ...

  9. m3u8文件合并处理

    m3u8文件合并处理 简介 M3U8 是 Unicode 版本的 M3U,用 UTF-8 编码."M3U" 和 "M3U8" 文件都是苹果公司使用的 HTTP ...

随机推荐

  1. [HDU5969] 最大的位或

    题目类型:位运算 传送门:>Here< 题意:给出\(l\)和\(r\),求最大的\(x|y\),其中\(x,y\)在\([l,r]\)范围内 解题思路 首先让我想到了前面那题\(Bits ...

  2. postgreSQL学习(二):pgsql的一些基础操作

    在上一篇文章中我们学习了怎么安装pgsql,安装好了后,我们来学习一下怎么对pgsql进行创建操作以及相关的crud的操作啦 一 创建数据库 $ createdb test 然后你可能会遇到如下的错误 ...

  3. Ubuntu最常见的包问题

    工作环境换成Ubuntu18.04小记:https://www.cnblogs.com/dunitian/p/9773214.html Ubuntu不得不说的就是这个apt出问题的处理 :(换源就不说 ...

  4. 大数质因解:浅谈Miller-Rabin和Pollard-Rho算法

    2017-07-19 08:54 Amphetamine:能发一下代码吗? 应我那位谜一样好友的邀约,我打算好好看一看Miller-Rabin和Pollard-Rho算法.很奇怪,各种地方有很多代码描 ...

  5. 关于进程、线程、应用程序域(AppDomain)

    什么是进程?什么是线程?什么是应用程序集?及三者之间的关系(以下做一些简单的概念性的理解) 三者共同的基础对象!!!——应用程序 1.进程是操作系统用于隔离众多正在运行的应用程序的机制,进程的缺点是降 ...

  6. 51nod1812树的双直径(换根树DP)

    传送门:http://www.51nod.com/Challenge/Problem.html#!#problemId=1812 题解:头一次写换根树DP. 求两条不相交的直径乘积最大,所以可以这样考 ...

  7. django - 总结 - 中间件

    中间件顾名思义,是介于request与response处理之间的一道处理过程,相对比较轻量级,并且在全局上改变django的输入与输出.因为改变的是全局,所以需要谨慎实用,用不好会影响到性能. MID ...

  8. 我是怎么知道 PTHREAD_MUTEX_INITIALIZER 是什么鬼东西的 ??

    很简单 写这么几句代码 1 #include <pthread.h> 2 3 PTHREAD_MUTEX_INITIALIZER cpp 一解析就出来了 1714 # 238 " ...

  9. javascript节点移除

    var itemdel = document.getElementById("test"); itemdel.removeChild(lis[0]); 兼容性较好 itemdel. ...

  10. shell使用lftp连接ftp和sftp,并可以指定私钥

    lftp连接ftp在脚本中可以 lftp -c "open username:password@host:port; ls /Friso/20180822/click/mobile/SUCC ...