基本介绍 国际化场景下面,播放器支持多字幕,可以有效解决视频的传播障碍难题,该功能适用于视频内容在全球范围内推广,阿里云的媒体处理服务提供接口可以生成多字幕,现在先看一下具体的效果: WebVTT格式介绍 多字幕现在支持HLS的格式,后期会去实现Dash格式的支持. 字幕文件 字幕的内容使用WebVTT的格式,更多的关于WebVTT可以参考WebVTT 格式如下: WEBVTT 00:00:09.960 --> 00:00:12.600 Argentina was among the found

基本介绍 Aliplayer默认支持中文和英文,并且依赖于浏览器的语言设置自动启用中文或英文资源, 除了支持这两种资源外,还提供自定义语言的形式,支持其他国际语言,另外Aliplayer还支持点播服务的多地域,可以支持VideoId的方式播放东南亚和欧洲的视频资源,英文版本播放器: 语言设置属性 Aliplayer提供language属性用于指定语言,此属性的优先级高于浏览器的语言设置,默认值为空,代码: var player = new Aliplayer({ id: "player-con&

不管是否承认,flash早已不像过往那样如日中天了.亚马逊全面放弃flash.苹果放弃flash.安卓也放弃了移动端的flash支持.事实上flash已经不太适合web开发了,因为HTML5中的video和audio这两个API为web开发提供了更高效的音频视频控制.或许你可以看看这篇文章. video标签 为何需要多个格式的视频文件 在HTML5页面中,我们可以使用video标签来实现对视频文件的控制.但是在浏览器中打开视频并没那么简单,不仅浏览器要支持标签,而且还要有编码译码器来播放视频.显

[开发必备]HTML5最全快速查找离线手册(可查询可学习,带实例) HTML5最全快速查找离线手册:https://pan.baidu.com/s/19seE8TJQSx4IsWgXtKQS0Aj9ys 涵盖内容有如下:HTML 5 Video + DOMHTML 5 音频HTML 5 拖放HTML 5 CanvasHTML 5 内联 SVGHTML 5 Canvas vs. SVGHTML 5 地理定位HTML 5 Web 存储HTML 5 应用程序缓存HTML 5 Web WorkersHT

1 /*2 * 说明:3 * 本源代码的中文注释乃Auscarlin呕心沥血所作.旨在促进jQuery的传播以及向广大jQuery爱好者提供一个进阶4 *的途径,以让各位更加深入地了解jQuery,学习其中有用的技术,从而为振兴中华JS出一份绵薄之力...(说大了...)5 *6 *本文件保留了jQuery代码原来的英文注释,个别语句我在其旁列出了尝试性的翻译(并标明这是翻译).水平有限希望读者能斟酌.7 *另外,本中文注释不是简单将原文翻译(jQuery作者那少得可怜的注释根本不足以让我们读通

知识说明: 比不上很牛的前端开发人员,但自始至终明白“万丈高楼平地起”,基础最重要,初学HTML5,稳固基础第一步,把最基本的整理下来,留下自己学习的痕迹.HTML5新增的video标签,将其属性以及API使用整理下来,无论以后用不用得到,都是自己的一笔宝贵的财富. Video标签: 一.video支持视频格式: 以下是三种最常用的格式 1. ogg格式:带有Theora视频编码(免费)+Vorbis音频编码的Ogg文件(免费) 支持的浏览器:firefox.chrome.opera 2. MP

方法 方法 描述 addTextTrack() 为音视频加入一个新的文本轨迹 canPlayType() 检查指定的音视频格式是否得到支持 load() 重新加载音视频标签 play() 播放音视频 pause() 暂停播放当前的音视频 属性 属性 描述 audioTracks 返回可用的音轨列表(MultipleTrackList对象) autoplay 媒体加载后自动播放 buffered 返回缓冲部件的时间范围(TimeRanges对象) controller 返回当前的媒体控制器(Med

1.对象集合:      (1).all[];      (2).images[];      (3).anchors[];      (4).forms[];      (5).links[];         2.属性:                   document.cookie;设置或返回当前文档有关的所有cookie           document.title;返回当前文档的标题           document.domain:返回当前文档的域名           d

事件与属性 属性 描述 audioTracks 返回可用的音轨列表(MultipleTrackList对象) autoplay 媒体加载后自动播放 buffered 返回缓冲部件的时间范围(TimeRanges对象) controller 返回当前的媒体控制器(MediaController对象) controls 显示播控控件 crossOrigin CORS设置 currentSrc 返回当前媒体的URL currentTime 当前播放的时间,单位秒 defaultMuted 缺省是否静音

1.对象集合:      (1).all[];      (2).images[];      (3).anchors[];      (4).forms[];      (5).links[];         2.属性:                   document.cookie;设置或返回当前文档有关的所有cookie           document.title;返回当前文档的标题           document.domain:返回当前文档的域名           d

Aliplayer视频播放器填坑 aliplayer视频点播分为Flash和HTML5两个版本,移动端不支持Flash播放器.Flash播放器兼容IE8+,HTML5播发器支持比较新的浏览器,对浏览器的版本要求较Flash播放器对浏览器的版本的要求要高一些.其中:h5播放器在移动端不支持flv和rtmp的播放播放flv.m3u8视频,PC端支持的浏览器,需要启用允许跨域访问 HLS标准加密与MPS私有加密对比 加密类型/设备环境 iOS Android PC 标准加密 HLS √ √ Chrom

基本介绍 Aliplayer提供了缩略图的功能,让用户在拖动进度条之前知道视频的内容,用户能够得到很好的播放体验,缩略图是显示在Controlbar的上面,并且包含当前的时间,阿里云的媒体处理服务提供接口可以生成缩略图的功能, 先看一下基本的效果: 缩略图的格式 WebVTT介绍 缩略图采用了webvtt的文件格式去表示时间和显示图片的对应关系,WebVTT不仅可读性好,而且解析也比较容易,下面是一个27秒包含3个截图的WebVTT文件内容: WEBVTT 00:00.000 --> 00:09

基本介绍 H5 Video是不提供截图的API的, 视频截图需要借助Canvas,通过Canvas提供的drawImage方法,把Video的当前画面渲染到画布上, 最终通过toDataURL方法可以导出图片的base64编码,基本就完成了图片截图的功能. 功能实现 Canvas接口介绍 drawImage接口 在画布上绘制图像.画布或视频,也能够绘制图像的某些部分,以及/或者增加或减少图像的尺寸,主要参数为: 参数 描述 img 规定要使用的图像.画布或视频. sx 可选.开始剪切的 x 坐标

基本介绍 时移直播基于常规的HLS视频直播,直播推流被切分成TS分片,通过HLS协议向播放用户分发,用户请求的m3u8播放文件中包含不断刷新的TS分片地址:对于常规的HLS直播而言,TS分片地址及相应的TS文件并不持久化保存,导致当前时间之前的直播视频内容无法回溯:而对于开通了时移功能的HLS直播而言,TS分片地址及相应TS文件会分别在数据库和OSS中持久化保存最长15天,使得回溯从直播开始时间到当前时间之间的视频内容成为可能.详情参见 直播时移, 播放器的表现为: 直播时移在播放器中的表现为可

基本介绍 网络环境比较复杂.网速不稳定,Aliplayer提供了多分辨率播放的模式,用户可以手工切换分辨率和播放器选择最优分辨率,基本UI如下: Source模式 source的方式指定多个清晰度的地址,这个模式在直播场景下使用的比较多,阿里云直播服务可以提供多码率的播放流地址,详细请参考:视频直播转码.Aliplayer提供了下面清晰度的对应关系: Code Text OD 原画 FD 流畅 LD 标清 SD 高清 HD 超清 2K 2K 4K 4K source如何支持多清晰度,参考下面的代

基本介绍 Aliplayer在进度条上提示时间和缩略图功能外,还可以进行视频内容的提示打点,当然不止是进度条上显示打点的内容,还提供一组接口,方便用户进行打点时间和内容的获取, 基本UI如下图所示: 接口和属性介绍 播放器提供了progressMakers属性,是一个数组类型,每一条记录包含offset时间和text打点的内容,还可以包含其他属性,此属性用于告诉播放器进度条打点记录,记录内容属性说明: 名称 类型 说明 offset Number 打点的视频偏移时间,单位:秒 text Stri

基本介绍 经常会碰到客户询问,为什么我设置了autoplay为true,但是没有自动播放,每次都要向客户解释这个是浏览器从用户体验角度考虑做的限制,客户会继续询问那我要怎么做? 针对这个问题Aliplayer也专们做过优化,提供一些方式让客户能更好的处理这种情况. 现象描述 有声音视频无法自动播放这个在移动端上一直都是这个限制,桌面版的Safari在2017年的11版本也宣布禁掉带有声音的多媒体自动播放功能,Chrome也在2018年4月份发布的66版本也正式关掉了声音自动播放,也就是说通过H5

基本介绍 如何保障视频内容的安全,不被盗链.非法下载和传播,阿里云视频点播已经有一套完善的机制保障视频的安全播放: 更多详细内容查看点播内容安全播放,H5的Aliplayer对于上面的安全机制都是支持的,但是也有一些限制. 访问限制 访问限制主要是阿里云视频云提供的安全访问能力, 只需要云端配置, 播放器无需做额外的事情,并且拒绝访问的原因会通过“X-Tengine-Error”Response Header返回,Http请求的错误的Code为403. 开启Referer防盗链后,如果Refer

本篇来说一下js中的属性: 1.静态属性 2.原型属性 3.实例属性 静态属性: function klass(){} var obj=new klass(); klass.count=0; klass.count++; console.log(obj.count);//undefined console.log(klass.count);//1 静态属性存在于对象中.它的访问方式只有:类名.count 一种方式,无法通过实例访问. 如:Math.PI 原型属性: 在讲解原型属性之前有必要先提一

一.问题来源 一直没有搞清楚NSString.NSArray.NSDictionary--属性描述关键字copy和strong的区别,看别人的项目中属性定义有的用copy,有的用strong.自己在开发中也是没有认真的去研究,至于使用copy还是用strong完全是根据心情随性而为,也一直没有出什么问题.可苹果竟然分了两个关键字,就肯定有其用意,为了提高自己还是要仔细的搞清楚其中之差别!好了,废话说完进入正题. 二.对象属性描述copy与strong的区别 直接上代码: ``` @propert