<html><head><meta charset='utf-8'></head><body><script>
const codec = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"';
class HttpPlayer {
constructor (width, height) {
const video = document.createElement('video');
const mediaSource = new MediaSource( );
mediaSource.onsourceopen = _evt => {
var completeFile = null;
var number = 1; // total number to get
const sourceBuffer = mediaSource.addSourceBuffer(codec);
const httpGet = _filename => {
const url = `https://${location.origin.split("//").pop( )}${_filename}`;
const https = new XMLHttpRequest( );
https.responseType = 'arraybuffer';
https.onload = ( ) => sourceBuffer.appendBuffer(https.response);
https.onloadend = ( ) => completeFile = _duration => {
completeFile = null;
number -- <= 0 ? mediaSource.endOfStream( ) : (( ) => {
sourceBuffer.timestampOffset = _duration - 2;
httpGet("/streamN.fmp4"); // next fmp4
})( );
}
https.open('get', url);
https.send( );
}
sourceBuffer.onupdateend = _evt =>
completeFile && completeFile(mediaSource.duration);
httpGet("/stream0.fmp4"); // initial fmp4
}
video.width = width;
video.height = height;
video.muted = true;
video.controls = "controls";
video.autoplay = "autoplay";
video.src = URL.createObjectURL(mediaSource);
document.body.append(video);
}
};
new HttpPlayer(1024, 768);
</script></body></html>
沒有留言:
張貼留言