- 支持MP4播放
- 支持全屏或比例显示
- 支持倍速和修改进度
- 支持AVC硬解码、HEVC硬解码、HEVC软解码，可自动判断浏览器是否支持HEVC硬解码
npm install
npm run build
node server.js
| 参数 | 说明 | 类型 |
|---|---|---|
| sourceURL | 视频地址 | String |
| type | 封装格式(MP4或HLS) | String |
| libPath | wasm的路径 | String |
| playBackRate | 播放速度 | Int |
| autoPlay | 是否自动开始播放 | Boolean |
| video | 页面中的video元素 | element |
| 方法名 | 说明 | 参数 |
|---|---|---|
| load | 加载视频 | - |
| play | 播放 | - |
| pause | 暂停 | - |
| destroy | 销毁播放器 | - |
| changeSrc | 切换视频源 | url |
| changeSpeed | 切换播放速度 | { value:speed } |
<!Doctype html>
<head>
<meta http-equiv=Content-Type content="text/html;charset=utf-8">
<meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href=/favicon.ico type=image/x-icon> <title>H.265在线播放器DEMO</title>
<link rel="stylesheet" href="../dist/lentoidplay-h265.css">
<script src="../dist/lentoidplay-h265-sdk.js"></script>
<style>
.inline {
display: inline-block;
width: 50px;
}
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
margin: 0;
padding: 0;
}
h1 {
color: #333;
text-align: center;
}
.play-container {
width: 800px;
height: 600px;
/* background-color: #000; */
margin: auto; /* 设置左右边距为auto，实现水平居中 */
}
</style>
</head>
<body>
<h1>H.265 Player <b>在线播放器</b><em class="demo1" id="Demo1">DEMO</em></h1>
<span class="setleft wid80"><span class="fyhbx">*</span>视频源:</span>
<div id="PlayerWrapper">
<div class="play-container"></div>
<!-- <a href="http://www.baidu.com">baidu.com</a> -->
</div>
<br clear="all">
<br>
<script>
(function (win, doc) {
const Config = {
get basePath() {
let path = win.location.origin
let pathname = win.location.pathname
let demoIdx = pathname.lastIndexOf('/demo/')
return path + pathname.substr(0, demoIdx)
},
get buildPath() {
return this.basePath + '/dist/'
},
get libPath() {
return this.buildPath + 'lib/'
},
get src() {
return this.basePath + '/history.mp4'
}
}
let el = doc.querySelector('.play-container')
const video = document.createElement('video')
let player = new LentoidPlay(el, {
poster: '',
sourceURL: 'http://xxx/xxx.mp4',
type: 'MP4',
libPath: Config.libPath,
playBackRate: 1,
autoPlay: false,
video: video
})
player.load()
// player.destroy()
})(window, document)
</script>
</body>
</html>