天天看點

阿裡雲 Aliplayer進階功能介紹(四):直播時移基本介紹 Aliplayer的使用 直播低延遲場景 時移回放位址

基本介紹

時移直播基于正常的HLS視訊直播,直播推流被切分成TS分片,通過HLS協定向播放使用者分發,使用者請求的m3u8播放檔案中包含不斷重新整理的TS分片位址;對于正常的HLS直播而言,TS分片位址及相應的TS檔案并不持久化儲存,導緻目前時間之前的直播視訊内容無法回溯;而對于開通了時移功能的HLS直播而言,TS分片位址及相應TS檔案會分别在資料庫和OSS中持久化儲存最長15天,使得回溯從直播開始時間到目前時間之間的視訊内容成為可能。詳情參見 

直播時移

, 播放器的表現為:

阿裡雲 Aliplayer進階功能介紹(四):直播時移基本介紹 Aliplayer的使用 直播低延遲場景 時移回放位址

直播時移在播放器中的表現為可以支援目前時間之前的直播内容的回看,當滑鼠放到進度條上面時,會出現負數的時間提示,表示回看之前的幾分幾秒的視訊。

https://www.atatech.org/articles/128458#1 Aliplayer的使用

Aliplayer提供了下面的一些屬性支援直播時移的配置:

名稱 必選 說明
isLive 值設定為true
liveTimeShiftUrl 時移資訊查詢URL怎麼生成參考
liveStartTime 直播開始時間
liveOverTime 直播結束時間
liveShiftSource 直播時移hls位址,隻有在source為flv直播流是需要設定

基本的代碼:

var player = new Aliplayer({
    id: "player-con",
    source: "https://video-dev.github.io/streams/x36xhzz/x36xhzz.m3u8",
    width: "100%",
    height: "500px",
    autoplay: true,
    isLive: true,
    liveStartTime:"2018/12/25 16:00:00",
    liveOverTime:"2018/12/25 18:00:00",
  }, function (player) {
    console.log("播放器建立成功");
  });
           
  • 開通直播時移

播放器的直播時移功依賴于阿裡雲直播服務的直播時移,首先需要到阿裡雲直播服務裡開通,詳情參見 

https://www.atatech.org/articles/128458#2 直播低延遲場景

HLS的延遲比較高,差不多10秒左右, 而flv的延遲基本到3秒左右,是以對于希望低延遲的場景,可以在直播時使用flv位址播放, 切換到時移時使用HLS的位址播放, Aliplayer支援這種模式: source屬性指定flv直播位址, liveShiftSource屬性指定hls的位址:

{
 source:'http://localhost/live/test.flv', //flv的播放位址
 liveShiftSource:'http://localhost/live/test.m3u8', //支援直播時移的HLS位址
}
           

另外需要指定recreatePlayer函數回調,用于切換為flv直播時,重新建立播放器:

var player = "";
var create = function(){
   player = new Aliplayer({
      recreatePlayer:function(){
      create();
      },
      .....
     },
     function(player){
      console.log('播放器已經建立');
    });
}
           

是以完整的代碼為:

var player = "";
var create = function(){
   player = new Aliplayer({
      id: "player-con",
      width: "100%",
      height: "500px",
      autoplay: true,
      //直播時移相關的屬性
      isLive: true,
      liveStartTime:"2018/12/25 16:00:00",
      liveOverTime:"2018/12/25 18:00:00",
      source:'http://localhost/live/test.flv',
      liveShiftSource:'http://localhost/live/test.m3u8',
      recreatePlayer:function(){
      create();
      },
      .....
     },
     function(player){
      console.log('播放器已經建立');
    });
}
           

當在回放狀态的時候,可以點選Control的"LIVE"圖示,可以切換為直播狀态:

阿裡雲 Aliplayer進階功能介紹(四):直播時移基本介紹 Aliplayer的使用 直播低延遲場景 時移回放位址

https://www.atatech.org/articles/128458#3 時移回放位址

當需要區間回放時候,直播服務的播放位址通過添加相關的參數,可以回放指定區間的視訊,具體參考:

 但是有一種特殊情況需要說明,如果時移回放的是以前某個區間的視訊, 比如目前是17點, 需要回看15點-16點的視訊,則可以推薦使用點播模式的位址,結束時間使用"vodend"參數,如果使用直播模式會有下面的問題:

  • duration計算不準确
  • 播放端的卡頓,暫停等操作,會導緻直播服務傳回的切片清單不準确

比如直播位址為http://domain/app/stream.m3u8, 當使用直播結束時間是,位址格式為:

http://domain/app/stream.m3u8?lhs_start=1&lhs_start_human_s_8=20171024160220&lhs_end_human_s_8=20171024160420"
           

使用點播結束時間的位址格式為:

http://domain/app/stream.m3u8?lhs_start=1&lhs_start_human_s_8=20171024160220&lhs_vodend_human_s_8=20171024160420"
           

主要差別結束參數lhs_end_human_s變為lhs_vodend_human_s, 使用點播格式的時間,表示使用點播模式回看,一次傳回指定時間段内的所有切片,包含endlist标簽。Aliplayer就使用點播模式觀看isLive設定為false.

let player = new Aliplayer({
      id: "player-con",
      width: "100%",
      height: "500px",
      autoplay: true,
      //不使用直播
      isLive: false,
      //直播時移的播放位址
      source:'http://localhost/live/test.m3u8?lhs_start=1&lhs_start_human_s_8=20171024160220&lhs_vodend_human_s_8=20171024160420"',
     },
     function(player){
      console.log('播放器已經建立');
    });           

繼續閱讀