ionic2中使用videogular2实现m3u8文件播放
// 安装依赖
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文件播放的更多相关文章
- vue-video-player集成videojs-contrib-hls实现.m3u8文件播放
// 安装依赖 npm install vue-video-player --save npm install videojs-contrib-hls --save // 在main.js中全局引入 ...
- m3u8文件什么合成便于播放的MP4的方法
先大家要知道M3U8文件不是一个视频文件,里面全是一些路径,说白了就是一个目录而已,所以要看视频,要找到对应存放视频的文件夹.如果不知道怎么找,可以使用文本格式打开M3U8文件,里面会有路径提示. ...
- m3u8文件简介
1. M3U8文件概念 M3U8文件是指UTF-8编码格式的M3U文件.M3U文件是记录了一个索引纯文本文件,打开它时播放软件并不是播放它,而是根据它的索引找到对应的音视频文件的网络地址进行在线播 ...
- HLS(HTTP Live Streaming)协议之m3u8文件生成方式
HLS(HTTP Live Streaming)是Apple的动态码率自适应技术.主要用于PC和Apple终端的音视频服务.包括一个m3u(8)的索引文件,TS媒体分片文件和key加密串文件. HLS ...
- m3u8文件信息总结
近期在做视频下载.本地播放功能的时候.发现的问题,先笔记记录一下 开发思路 (1) 在线解析m3u8文件内容,把里面的ts相应连接的资源下载本地的Document文件下. (2) 把下载下来的资源使 ...
- 关于流媒体(m3u8)的播放与下载
前一段时间做了一个视频播放下载应用,抓取的是优酷的视频,虽然优酷有自己的开发平台http://open.youku.com/,但未真正的实现.所以只能靠抓取视频源,Youku的视频采取了加密+动态的获 ...
- HLS的M3U8文件介绍
HLS的M3U8文件介绍 HLS (HTTP Live Streaming)是Apple的动态码率自适应技术.主要用于PC和Apple终端的音视频服务. 相较于实时传输协议(RTP),HLS可以穿过任 ...
- 关于大视频video播放的问题以及解决方案(m3u8的播放)
在HTML5里,提供了<video>标签,可以直接播放视频,video的使用很简单: <video width="320" height="240&qu ...
- m3u8文件合并处理
m3u8文件合并处理 简介 M3U8 是 Unicode 版本的 M3U,用 UTF-8 编码."M3U" 和 "M3U8" 文件都是苹果公司使用的 HTTP ...
随机推荐
- Scrapy-redis 组件
scrapy-redis 简介 scrapy-redis是scrapy框架基于redis数据库的组件,用于scrapy项目的分布式开发和部署. 特征 分布式爬取 可以启动多个spider工程,相互之间 ...
- python学习日记(OOP——类的内置方法)
__str__和__repr__ 改变对象的字符串显示__str__,__repr__ 我们先定义一个Student类,打印一个实例: class Student(object): def __ini ...
- ajax 跨域 springboot
CORS 定义 Cross-Origin Resource Sharing(CORS)跨来源资源共享是一份浏览器技术的规范,提供了 Web 服务从不同域传来沙盒脚本的方法,以避开浏览器的同源策略,是 ...
- Oracle jdbc 连接
所需jar包: ojdbc6.jar 下载地址:https://download.csdn.net/download/xc_oo0/10897959 示例代码: package cnblogs.com ...
- 洛谷P1072 Hankson 的趣味题(题解)
https://www.luogu.org/problemnew/show/P1072(题目传送) 数学的推理在编程的体现越来越明显了.(本人嘀咕) 首先,我们知道这两个等式: (a0,x)=a1,[ ...
- Java EE 开发环境搭建
1 Windows 1.1 JDK 下载: 下载地址:https://developer.oracle.com/java 安装文件:jdk-8u201-windows-x64.exe JDK 并不是越 ...
- Mycat的读写分离
1. Mycat实现读写分离的部署: https://www.cnblogs.com/softidea/p/5447566.html springboot动态数据源的原理以及配置: Spring内置了 ...
- linux c编程之fcntl
fcntl可实现对指定文件描述符的各种操作,其函数原型如下: int fcntl(int fd, int cmd, ... /* arg */ ); 其中,操作类型由cmd决定.cmd可取如下值: F ...
- 驱动调试(四)oops确定调用树
目录 驱动调试(四)oops确定调用树 内核开启调用树 栈指针分析 原理 寄存器别名 基础解释 例子分析 找到PC地址的位置 栈分析 附录:原文的excel title: 驱动调试(四)oops确定调 ...
- DMA设计
目录 DMA设计 DMA框架 手册请看英文手册 芯片特性 请求来源 协议简述 基本时序 模式 协议 数据大小的描述 具体完整的实例时序 代码设计 驱动程序 测试程序 测试 参考链接 title: DM ...