1、概述
鉴于目前 H5-Video 在 Web 生态环境中存在较大差异化(兼容性)的表现,本文主要介绍使用奇舞团开发chimee 组件进行视频播放的用法。
chimee 组件地址:
http://chimee.org/docs/index.html
2、chimee 组件特点
Chimee支持MP4、M3U8、FLV等多种媒体格式,同时它也帮我们解决了大部分的兼容性、差异化问题,包括全屏、自动播放、内联播放、直播解码等常见媒体播放需求。
3、PC端 Chimee-Player解决方案
<!DOCTYPE html><html lang="zh"> ???<head> ???????<meta charset="UTF-8" /> ???????<meta name="viewport" content="width=device-width, initial-scale=1.0" /> ???????<meta http-equiv="X-UA-Compatible" content="ie=edge" /> ???????<title>PC端 Chimee-Player解决方案</title> ???</head> ???<body> ???????<div id="wrapper"> ???????????????????</div> ???????<script src="http://lib.baomitu.com/chimee-player/1.1.10/chimee-player.browser.js"></script> ???????<script> ???????????new ChimeePlayer({ ???????????????wrapper: ‘#wrapper‘, // video dom容器 ???????????????src: ‘http://chimee.org/vod/1.mp4‘, ???????????????controls: true ???????????}); ???????</script> ???</body></html>
4、移动端 Chimee-Mobile-Player解决方案
<!DOCTYPE html><html lang="zh"> ???<head> ???????<meta charset="UTF-8" /> ???????<meta name="viewport" content="width=device-width, initial-scale=1.0" /> ???????<meta http-equiv="X-UA-Compatible" content="ie=edge" /> ???????<title>移动端 Chimee-Mobile-Player解决方案</title> ???</head> ???<body> ???????<div id="wrapper"> ???????</div> ???????<!--注意路径--> ???????<script src="chimee-mobile-player.js" type="text/javascript" charset="utf-8"></script> ???????<script> ???????????new ChimeeMobilePlayer({ ???????????????wrapper: ‘#wrapper‘, // video dom容器 ???????????????src: ‘http://chimee.org/vod/1.mp4‘, ???????????????autoplay: true, ???????????????controls: true, ???????????????playsInline: true, ???????????????preload: true, ???????????????x5VideoPlayerFullscreen: true, ???????????????x5VideoOrientation: true, ???????????????xWebkitAirplay: true, ???????????????muted: true ???????????}); ???????</script> ???</body></html>
chimee-mobile-player.js文件位于:https://github.com/Chimeejs/chimee-mobile-player/edit/master/lib/chimee-mobile-player.browser.js
网页视频播放方案chimee 组件使用
原文地址:https://www.cnblogs.com/mengfangui/p/8274265.html