1、 項目背景
由于本人項目需要,需要在視頻點播服務之中需要加載字幕文件(通用格式srt),經過比較好幾家的公有云服務,最后選擇只有百度云提供字幕服務。
字幕:我們通常在觀看外語電影的是,沒有國語版時候只能通過下載字幕,了解其中表達的意義。
百度云提供多種授權方式,但是為了保障數據能夠安全授權,最后使用STS(Security Token Service)臨時授權的方式來實現視頻文件的上傳,具體操作如下圖所示流程:
2、百度云提供示例及大坑:
百度云提供的示例都在github上,應該是百度上海一個員工在維護,具體地址如下:
其中一個大坑:
這些提供的示例:都是為可考慮您在本地能夠運行,都模擬了一個簡單的HttpServer服務然后按照相關的示例運行步驟都可以正常運行和上傳資源到您自己的百度云服務器之中。具體可參考如下所示的操作:
bce-sdk-js samples
初始化
運行 sample 代碼之前,首先需要修改一下?config.json,添加ak,?sk,?bucket?的配置:
項目
默認值
port
8800
enable_sts
true
ak
sk
bucket
endpoint
https://bj.bcebos.com
安裝依賴
npm install
根據配置文件 config.json,自動生成一些代碼
npm run prepare
啟動 server
類別
命令
frontend
node frontend/main.js
Node.js backend
cd backend/nodejs; node main.js
php backend
cd backend/php; php main.php
java backend
cd backend/java; mvn clean install exec:java -Dexec.mainClass=com.baidu.inf.bce.App
關于 crossdomain.xml
IE下面跨域請求是通用 moxie.swf 發起的,因此涉及到一些 crossdomain.xml 文件的配置。
但是這些所有的操作都依賴于和運行在HttpServer之中的,這種方式是無法滿足,把這個上傳功能模塊集成到項目的工程之中的,因為您的項目之中無法接受你運行一個獨立的HttpServer服務的。
3、真實項目使用方式(集成到項目之中提供API獲得STS授權)
于是只能另外尋找其他方式,希望通過寫一個普通的接口,然后前端能夠直接調用后臺的接口API。
實現STS授權文件上傳的具體業務流程
3.1、后端提供一個生成STS授權服務的接口(重點注意事項:后端提供的STS獲得接口必須支持JSONP的否則前端無法實現文件上傳),
3.2、前端直接訪問接口獲得相關的STS授權信息,由于授權可以設置權限的時效性,于是乎需要考慮sessionToken過期的情況,需要前端上傳文件之前判斷獲得STS是否在有效期內。
在下想過很多之種方法,最后甚至詢問了兄弟單位,他們使用的PHP方式來實現的文件上傳,然后獲得臨時授權,甚至請求他們給了部分實現如何獲得STS授權的源碼如下圖所示:
百度后端PHP生成STS
3、百度云點播VOD服務,使用STS方式上傳文件基本使用ES6前端編碼實現上傳
return api.getToken().then((data) => {
this._tokenTime = +new Date() + expireMs;
return this.client = new baidubce.bos.Uploader({
bos_bucket: data.bucket || this.bucket,
bos_endpoint: this.endPoint,
bos_ak: data.accessKeyId,
bos_sk: data.secretAccessKey,
uptoken: data.sessionToken,
bos_task_parallel: 1,
init: init
});
});
在添加文件之前判斷_tokenTime < 當時時間
this.client.setOptions({ ? bos_ak: data.accessKeyId,
bos_sk: data.secretAccessKey,
uptoken: data.sessionToken
}); 更新token
返回結果 如果前端需要處理 建議過期時間格式為 2018-01-26 22:45:00
{"bucket":"***",//返回你自己的bucket"accessKeyId":"6dc9c09800b111e8bec5dd8bafa1b8e0","secretAccessKey":"0042398f67ce4508b4f3cef87c634f7e","securityToken":"MjUzZjQzNTY4OTE0NDRkNjg3N2E4YzJhZTc4YmU5ZDh8AAAAAFoBAADkQOwuM8FBxyU6ZaFwkS9bF7VgK9LM+9JS1HdiZAEGOmDjFD9d8IrR5mktyfagQVw2I5M3Fy0icAUK8kwgzVRpNWMmlImJL9T1RHWTDzqvBvgbXAfQXOUwF/SEP0QgN3aihA6+0MgHLkFjR1kXKe4EeNsQAO9Ut00mL8h/MCoWo0BdhcGOGVYbje7f+vl09pXWycYVcYqjmjPLqmuoEQ0GuHPr1/j6WpTjvdJsiSx4Qe0/y21S5LxHdk+dqXofnoUiTWPi8mh7/bCHmgDoA0NT8TBquKuWGQdETayCEklYIQ==","expiresAt":"Wed Jan 24 22:51:08 CST 2018"}
雖然有了兄弟單位提供基本示例,但是沒有參透其中的玄機;還是不明白如何能夠不通過運行HttpServer,通過接口方式直接獲得STS相關的授權信息。最后仔細閱讀了示例之中uploader之中的必選參數,如下圖所示
然后參照提供示例的后端Java實現代碼,把后端改造為如下方式
特別注意 其中里面后端代碼支持JSONP模式的關鍵點參數 callback
如果理解透徹這一點,您在你的項目之中能夠實現基本的API就可以獲得百度云提供STS授權認證模式。然后在分析兄弟單位提供的PHP其實也是實現JSONP的方式。然后本人也特意在網上收集如何在服務端支持JSONP如下文件鏈接