JSMpeg的使用

<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>

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

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)