2016-09-17 30 views
1

我想創建自己的代碼來播放使用媒體源的實時MPEG-DASH,我成功獲取數據但無法在播放器中顯示它。創建我自己的現場直播球員

function GETData(){ 
 
\t var xhr = new XMLHttpRequest(); \t \t \t 
 
\t xhr.onreadystatechange = function() \t { 
 
\t \t if(xhr.readyState == 4 && xhr.status == 200){ 
 
\t \t \t liveIndex++; 
 
\t \t \t receiveBuffer.push(xhr.response); 
 
\t \t \t if(audio == false){ 
 
\t \t \t \t appendVideo(); 
 
\t \t \t \t audio = true; 
 
\t \t \t } \t \t \t \t \t \t 
 
\t \t \t else{ 
 
\t \t \t \t appendAudio(); 
 
\t \t \t \t audio = false; 
 
\t \t \t } \t \t \t 
 
\t \t } 
 
\t }; \t \t 
 
\t xhr.open("GET", urlList[liveIndex], true); 
 
\t xhr.responseType = 'arraybuffer'; \t \t 
 
\t xhr.send(); 
 
} 
 
function updateVideoFunc(){ \t 
 
\t sbVideo.removeEventListener("update", updateVideoFunc); 
 
\t GETData(); \t \t 
 
} 
 
function updateAudioFunc(){ \t 
 
\t sbAudio.removeEventListener("update", updateAudioFunc); 
 
\t GETData(); \t \t 
 
} 
 

 
function sourceopen(e){ \t 
 
\t sourceBuffer = this.sourceBuffers; 
 
\t sourceBuffer[trackName] = ms.addSourceBuffer('video/mp4;codecs=avc1.42c01e'); 
 
\t sbVideo =sourceBuffer[trackName]; 
 
    sbVideo.addEventListener('updateend', updateVideoFunc); 
 
    
 
\t 
 
\t sourceBuffer = this.sourceBuffers; 
 
\t sourceBuffer[trackName2] = ms.addSourceBuffer('audio/mp4;codecs="mp4a.40.2'); 
 
\t sbAudio =sourceBuffer[trackName2]; 
 
    sbAudio.addEventListener('updateend', updateAudioFunc); 
 
    
 
\t GETData(); 
 
} 
 

 
var fileIndex = 0; 
 
function appendVideo() 
 
\t if(sbVideo.updating == false) 
 
\t { 
 
\t \t 
 
\t \t sbVideo.appendBuffer(new Uint8Array(receiveBuffer[fileIndex])); 
 
\t \t sbVideo.addEventListener("updateend",updateVideoFunc, false); \t \t \t \t \t 
 
\t \t fileIndex++; 
 
\t } 
 
} 
 

 

 
function appendAudio(){ 
 
\t if(sbAudio.updating == false && sbVideo.updating == false){ 
 
\t \t 
 
\t \t sbAudio.appendBuffer(new Uint8Array(receiveBuffer[fileIndex])); 
 
\t \t sbAudio.addEventListener("updateend",updateAudioFunc, false); \t \t \t \t \t 
 
\t \t fileIndex++; 
 
\t } 
 
}

該代碼使用不活源的時候,而不是活代碼工作。 我錯過了什麼?

回答

0

視頻的播放頭默認爲0。但是,在追加實時流的數據時,數據範圍不會以0開頭,而是直播流的位置。所以你要麼需要使用SourceBuffer的timestampOffset,要麼簡單地尋找(即設置currentTime)到數據開始的地方。

您還可以看到這是如何在開源播放器完成,如Shakadash.js或者你可以用一個現成的解決方案,如Bitmovin Player或JWPlayer。