百度開放雲 視頻轉碼服務

在上一篇文章中，咱們介紹瞭如何藉助 百度開放雲的文檔轉碼服務 來方便的處理各類文檔格式，同時還能夠藉助跨平臺的文檔播放器來方便的查看轉碼以後的效果。

在這篇文章裏面，咱們繼續介紹，如何藉助百度開放雲的視頻轉碼服務，方便的處理各類視頻格式，同時藉助跨平臺的播放器，方便的查看視頻轉碼以後的效果

安裝 bce-bos-uploader

咱們不直接使用 bce-sdk-js，由於默認狀況下，bce-sdk-js 只能支持現代瀏覽器，不過咱們在 bce-bos-uploader 裏面對於網絡交互的部分，進行了適配，所以能夠在比較低版本的IE下面運行。

bower install bce-bos-uploader

頁面中引用相關的資源

<!--[if lt IE 8]><script src="bower_components/json3/lib/json3.min.js"></script><![endif]-->
<!--[if lt IE 9]><script src="bower_components/js-polyfills/es5.js"></script><![endif]-->
<!--[if lt IE 10]><script src="bower_components/moxie/bin/js/moxie.min.js"></script><![endif]-->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bce-bos-uploader/bce-bos-uploader.bundle.min.js"></script>

默認配置

var AK = 'your ak';
var SK = 'your sk';
var VOD_ENDPOINT = 'http://vod.baidubce.com';
var BOS_ENDPOINT = 'https://bj.bcebos.com';
var CHUNK_SIZE = '1m';

初始化 VodClient

視頻轉碼的流程以下：

1. 調用 vod 的 API，獲取文件須要存儲到 bos 上面的 bucket 和 object 名稱

2. 調用 uploader 的 API，把文件上傳到 bos

3. 調用 vod 的 API，啓動轉碼任務

var vod = new baidubce.sdk.VodClient({
  endpoint: DOC_ENDPOINT,
  credentials: {ak: AK, sk: SK}
});

咱們把文件上傳到 BOS 以前，須要調用 vod 的 API，獲取應該文件的存在位置：

function getVodKey(file) {
  return vod.buildRequest('POST', null, 'apply').then(function (response) {
    var mediaId = response.body.mediaId;
    var bucket = response.body.sourceBucket;
    var key = response.body.sourceKey;
    file.__mediaId = mediaId;
    return {
      bucket: bucket,        // 文件會上傳到這個 bucket
      key: key               // 文件路徑是 key
    };
  });
}

初始化 Uploader

在頁面中放置一個上傳控件：

<input type="file" id="file" />

而後初始化 bce-bos-uploader

var uploader = new baidubce.bos.Uploader({
  browse_button: '#file',
  multi_selection: true,
  bos_endpoint: BOS_ENDPOINT,
  bos_ak: AK,
  bos_sk: SK,
  auto_start: true,
  max_file_size: '1Gb',
  flash_swf_url: 'bower_components/moxie/bin/flash/Moxie.swf',
  init: {
    Key: function (_, file) {
      // 這裏須要調用剛纔實現的 getVodKey 這個方法
      return getVodKey(file);
    },
    FileUploaded: function (_, file, info) {
      // 調用 轉碼服務的接口，提交轉碼請求
      vod._internalCreateMediaResource(file.__mediaId, file.name, '測試文件').then(function () {
        // 轉碼任務提交成功，能夠考慮在頁面顯示 file.__mediaId
      });
    },
    Error: function (_, error, file) {
      // 處理錯誤
    }
  }
});

查看當前轉碼的視頻列表

提交了視頻轉碼請求以後，咱們能夠經過調用 vod.listMediaResources() 接口獲取全部的視頻轉碼任務，若是某個任務的狀態是 PUBLISHED 了，那麼就能夠播放視頻了：

vod.listMediaResources().then(function (response) {
  console.log(response.body. media);
});

獲取播放器地址

若是某個轉碼任務的狀態是 PUBLISHED，那麼就能夠調用 doc.getPlayerCode(mediaId, width, height, autoStart) 的接口獲取播放器的代碼：

var mediaId = 'the PUBLISHED media id';
var width = 600;
var height = 300;
var autoStart = true;
doc.getPlayerCode(mediaId, width, height, autoStart).then(function (response) {
  console.log(response.body.codes);
});

最終能夠在瀏覽器裏面播放轉碼以後的視頻：http://resource.bcevod.com/vod/v1/online/Player.swf?media_id=mda-gd1hbi22ka1fm4s5&auto_start=true