基本介绍
网络环境比较复杂、网速不稳定,Aliplayer提供了多分辨率播放的模式,用户可以手工切换分辨率和播放器选择最优分辨率,基本UI如下:

66ccc596257a5db1d0f106b57454e14da6a8f61e

Source模式
source的方式指定多个清晰度的地址,这个模式在直播场景下使用的比较多,阿里云直播服务可以提供多码率的播放流地址,详细请参考:视频直播转码。Aliplayer提供了下面清晰度的对应关系:

Code Text
OD 原画
FD 流畅
LD 标清
SD 高清
HD 超清
2K 2K
4K 4K
source如何支持多清晰度,参考下面的代码:

var player = new Aliplayer({

id: "player-con",
isLive:true,source:'{"HD":"https://livecdn.com/appname/testhd.flv","SD":"https://livecdn.com/appname/testsd.flv","FD":"https://livecdn.com/appname/testfd.flv","LD":"https://livecdn.com/appname/testld.flv"}',
width: "100%",
height: "500px",
autoplay: true

}, function (player) {

console.log("播放器创建成功");

});
videoId模式
播放点播服务的视频时,采用videoId的模式, Aliplayer会获取用户在点播服务转码生成的多分辨率的视频地址,生成多清晰度选择列表,详细参考点播转码。

如果用户转码生成多种视频格式文件,Aliplayer将会按照mp4->m3u8->flv的顺序优先选择播放,如果有加密视频和普通视频一起,点播服务将只会返回加密视频的播放地址。Aliplayer提供了其他一些属性可以做精确的获取点播视频的播放地址:


播放器的使用代码为:

var player = new Aliplayer({

id: "player-con",
width: "100%",
height: "500px",
autoplay: true,
language: "en-us",
vid : '1e067a2831b641db90d570b6480fbc40',
playauth:'ddddfdfdf'
format:'m3u8',
mediaType:'video',
qualitySort:'desc',
definition:'FD,LD',
defaultDefinition:'LD'

}, function (player) {

console.log("播放器创建成功");

});
HLS的多码率
HLS HTTP Live Streaming是Apple提出的基于http的流媒体传输协议,支持不同带宽的多码率地址,基本格式如下:

EXTM3U

EXT-X-VERSION:4

EXT-X-STREAM-INF:BANDWIDTH=454521,AVERAGE-BANDWIDTH=432061,CODECS="avc1.42c01e,mp4a.40.5",RESOLUTION=340x192,FRAME-RATE=25.000

GEPH-ONTHERECS02E012C-_E17101101_master_stream_x3f6b2fee5c3d4f388ed8edee586bd6f8_340.m3u8

EXT-X-STREAM-INF:BANDWIDTH=691401,AVERAGE-BANDWIDTH=644868,CODECS="avc1.42c01e,mp4a.40.5",RESOLUTION=384x216,FRAME-RATE=25.000

GEPH-ONTHERECS02E012C-_E17101101_master_stream_x3f6b2fee5c3d4f388ed8edee586bd6f8_384.m3u8

EXT-X-STREAM-INF:BANDWIDTH=926476,AVERAGE-BANDWIDTH=850169,CODECS="avc1.42c01f,mp4a.40.5",RESOLUTION=512x288,FRAME-RATE=25.000

EXT-X-STREAM-INF:BANDWIDTH=7011961,AVERAGE-BANDWIDTH=6374698,CODECS="avc1.640028,mp4a.40.5",RESOLUTION=1920x1080,FRAME-RATE=25.000

GEPH-ONTHERECS02E012C-_E17101101_master_stream_x3f6b2fee5c3d4f388ed8edee586bd6f8_1920.m3u8
EXT-X-STREAM-INF:BANDWIDTH里的指定带宽,下面为此带宽使用对应分辨率的视频地址,Aliplayer解析上面的master m3u8内容,展示清晰度列表,并且会根据网络情况选择合适的清晰度播放:

阿里云 Aliplayer高级功能介绍(七):多分辨率相关推荐

  1. 阿里云 Aliplayer高级功能介绍(二):缩略图

    为什么80%的码农都做不了架构师?>>>    基本介绍 Aliplayer提供了缩略图的功能,让用户在拖动进度条之前知道视频的内容,用户能够得到很好的播放体验,缩略图是显示在Con ...

  2. 阿里云 Aliplayer高级功能介绍(三):多字幕

    基本介绍 国际化场景下面,播放器支持多字幕,可以有效解决视频的传播障碍难题,该功能适用于视频内容在全球范围内推广,阿里云的媒体处理服务提供接口可以生成多字幕,现在先看一下具体的效果: WebVTT格式 ...

  3. 阿里云 Aliplayer高级功能介绍(四):直播时移

    基本介绍 时移直播基于常规的HLS视频直播,直播推流被切分成TS分片,通过HLS协议向播放用户分发,用户请求的m3u8播放文件中包含不断刷新的TS分片地址:对于常规的HLS直播而言,TS分片地址及相应 ...

  4. 阿里云 Aliplayer高级功能介绍(二):缩略图 1

    基本介绍 Aliplayer提供了缩略图的功能,让用户在拖动进度条之前知道视频的内容,用户能够得到很好的播放体验,缩略图是显示在Controlbar的上面,并且包含当前的时间,阿里云的媒体处理服务提供 ...

  5. 阿里云Aliplayer高级功能介绍(一):视频截图

    基本介绍 H5 Video是不提供截图的API的, 视频截图需要借助Canvas,通过Canvas提供的drawImage方法,把Video的当前画面渲染到画布上, 最终通过toDataURL方法可以 ...

  6. 阿里云Aliplayer高级功能介绍(一):视频截图 1

    基本介绍 H5 Video是不提供截图的API的, 视频截图需要借助Canvas,通过Canvas提供的drawImage方法,把Video的当前画面渲染到画布上, 最终通过toDataURL方法可以 ...

  7. 阿里云 Aliplayer高级功能介绍(九):自动播放体验

    基本介绍 经常会碰到客户询问,为什么我设置了autoplay为true,但是没有自动播放,每次都要向客户解释这个是浏览器从用户体验角度考虑做的限制,客户会继续询问那我要怎么做? 针对这个问题Alipl ...

  8. 阿里云 Aliplayer高级功能介绍(五):多语言

    基本介绍 Aliplayer默认支持中文和英文,并且依赖于浏览器的语言设置自动启用中文或英文资源, 除了支持这两种资源外,还提供自定义语言的形式,支持其他国际语言,另外Aliplayer还支持点播服务 ...

  9. 阿里云 Aliplayer高级功能介绍(九):自动播放体验 1

    基本介绍 经常会碰到客户询问,为什么我设置了autoplay为true,但是没有自动播放,每次都要向客户解释这个是浏览器从用户体验角度考虑做的限制,客户会继续询问那我要怎么做? 针对这个问题Alipl ...

最新文章

  1. 突破帧率天花板,超速全时视觉感知芯片重塑机器视觉技术体系
  2. android 数据存储怎么保存图片_文章要保存为TXT文件,其中的图片要怎么办?Python帮你解决...
  3. POJ 1944 Fiber Communications (枚举 + 并查集 OR 线段树)
  4. 线程WAITING--BlockingQueueDemo
  5. mysql初级知识梳理与练习
  6. 机房收费系统个人重构版:透过文档谈文档驱动开发
  7. MiniApp微信小程序入口在安卓手机桌面
  8. Python和FFmpeg将语音记录转换成可共享的视频,非常炫酷。
  9. 【测试开发】Python—zipfile库文件压缩封装
  10. 前端如何创建好看的简洁的蒙版弹窗
  11. 网络爬虫——爬取京东数据
  12. win10安装MinGW-64
  13. 数数字(UVa1225)
  14. java中的静态是什么?怎么用?
  15. 2.利用docker+雨巷云打造私有网盘之安装nextcloud14.0.13
  16. Chap.19 总结《CL: An Introduction》 (Vyvyan Evans)
  17. 将H264码流打包成RTP包
  18. Vulcanexus机器人操作系统ROS2一站式工具集(Galactic+Humble)
  19. 智能家居项目开发: 设计模式(工厂模式)+ 线程池 + Socket (持续更新中)
  20. python--健康体检

热门文章

  1. 论文阅读——A Deep Learning Design for improving Topology Coherence in Blood Vessel Segmentation
  2. EFT4 生成实体类
  3. 海盐、低钠岩盐、腌制盐……这么多盐到底有什么不同啊?
  4. 计算机表格应用试卷,2020年7月网络教育统考《计算机应用基础》电子表格模拟题试卷操作题...
  5. AFNetworking(v3.0+)框架学习总结(三框架基本使用)
  6. Android打开隐藏的应用
  7. android弱网模拟路由器,Mac 下使用命令行模拟弱网环境
  8. 亚马逊 广告接口对接 amazon advertising
  9. 【我参加NVIDIA Sky Hackathon】感悟篇
  10. Java8 时间日期使用总结