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如下文件链接