JSMpeg是JS写的视频、音频解码器，能使用WebGL&Canvas2D渲染以及WebAudio声音输出。
1.官网：https://jsmpeg.com/
github:https://github.com/phoboslab/jsmpeg
官方例子:https://jsmpeg.com/perf.html
2.简单例子
<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, //这里需要屏蔽，不然有可能导致IOS没有声音 chunkSize: 4 * 1024 * 1024, disableGl: false, audio: true, autoplay:true, loop:false, onSourceCompleted:()=>{ } }); player.play(); </script>
3.注意事项
①需要转换为特定的格式，比如将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)
注意：设置throttled属性也有可能导致IOS不能发声，需要将这个属性屏蔽掉。
以上。