jsmpeg.js_h5移动端视频自动播放
在移动端使用h5自动的video标签播放视频，设置autoplay属性，在android端部分不支持，全屏播放还存在层级问题，ios10以上版本支持视频自动播放，以下版本不支视频自动播放。
JSMpeg是JS写的视频、音频解码器，能使用WebGL&Canvas2D渲染以及WebAudio声音输出。
官网：https://jsmpeg.com/
github:https://github.com/phoboslab/jsmpeg
官方例子:https://jsmpeg.com/perf.html
简单例子
<canvas id="video" width="667" height="375"></canvas>
<script type="text/javascript" src="jsmpeg.min.js"></script>
<script>
var player = new JSMpeg.Player('test.ts', {
canvas: document.getElementById('video'),
decodeFirstFrame: true,
disableWebAssembly: false,
throttled: false, //这里设置为false，不然不触发onSourceCompleted事件
chunkSize: 4 * 1024 * 1024,
disableGl: false,
audio: true,
autoplay:true,
loop:false,
onSourceCompleted:()=>{
}
});
player.play();
</script>注意事项
①需要转换为特定的格式，比如将mp4文件进行转换：
ffmpeg -i in.mp4 -f mpegts \
-codec:v mpeg1video -s 960x540 -b:v 1500k -r 30 -bf 0 \
-codec:a mp2 -ar 44100 -ac 1 -b:a 128k \
out.ts②IOS声音问题：IOS播放时默认没有声音，需要用户点击后才能发声（相当于获得用户允许后才能发声）。解决方案就是在启动时增加一个开始按钮或者增加一个音量已关闭的按钮，让用户点击时解锁声音。
function onUnlocked () {
player.volume = 1
document.removeEventListener('touchstart', onTouchStart)
}
function onTouchStart () {
player.audioOut.unlock(onUnlocked)
document.removeEventListener('touchstart', onTouchStart)
}
// try to unlock immediately
player.audioOut.unlock(onUnlocked)
// try to unlock by touchstart event
document.addEventListener('touchstart', onTouchStart, false)以上。
本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！
