腾讯云云点播如何通过 Web 上传视频_音视频解决方案_同尘科技
使用须知
Demo 功能介绍
本 Demo 向开发者展示如何通过 Web 页面将视频上传到云点播。Demo 基于云函数(SCF)搭建了两个 HTTP 服务:第一个服务用于接收来自浏览器获取 客户端上传签名 的请求,计算上传签名并返回。第二个服务使用 VOD Web 上传 SDK 实现一个页面,用户可以通过浏览器访问该页面,并上传本地视频到 VOD。
架构和流程
系统主要涉及四个组成部分:浏览器、API 网关、云函数和云点播,其中 API 网关和云函数即是本 Demo 的部署对象,如下图所示:
主要业务流程为:1. 浏览器向 SCF 请求上传页面。2. 用户在上传页面进行操作,选中本地视频后点击上传,由浏览器向 SCF 请求上传签名。3. 浏览器使用上传签名向 VOD 发起上传请求,完成后在上传页面上展示上传结果。说明:Demo 中的 SCF 代码使用 Python3.6 进行开发,此外 SCF 还支持 Python2.7、Node.js、Golang、PHP 和 Java 等多种编程语言,开发者可以根据情况自由选择,具体请参考 SCF 开发指南。
费用
本文提供的云点播 Web 上传 Demo 是免费开源的(含 Web 页面代码和业务后台代码),但在搭建和使用的过程中可能会产生以下费用:购买腾讯云云服务器(CVM)用于执行服务部署脚本,详见 CVM 计费。使用腾讯云云函数(SCF)提供上传页面和签名派发服务,详见 SCF 计费 和 SCF 免费额度。使用腾讯云 API 网关为 SCF 提供外网接口,详见 API 网关计费。消耗云点播(VOD)存储用于存储上传的视频,详见 存储计费 和 存储资源包。消耗云点播流量用于播放视频,详见 流量计费 和 流量资源包。
快速部署 Web 上传 Demo
Web 上传 Demo 部署在 SCF 上,并由 API 网关提供服务入口。为了方便开发者搭建服务,我们提供了快捷部署脚本,使用方法如下。
步骤1:准备腾讯云 CVM
部署脚本需要运行在一台腾讯云 CVM 上,要求如下:地域:任意。机型:官网最低配置(1核1GB)即可。公网:需要拥有公网 IP,带宽1Mbps或以上。操作系统:官网公共镜像Ubuntu Server 16.04.1 LTS 64位
或Ubuntu Server 18.04.1 LTS 64位
。购买 CVM 的方法请参见 操作指南 – 创建实例。重装系统的方法请参见 操作指南 – 重装系统。注意:Web 上传 Demo 本身并不依赖于 CVM,仅使用 CVM 来执行部署脚本。如果您没有符合上述条件的腾讯云 CVM,也可以在其它带外网的 Linux(如 CentOS、Debian 等)或 Mac 机器上执行部署脚本,但需根据操作系统的区别修改脚本中的个别命令,具体修改方式请开发者自行搜索。
步骤2:开通云点播
请参考 快速入门 – 步骤1 开通云点播服务。
步骤3:获取 API 密钥和 APPID
Web 上传 Demo 服务的部署和运行过程需要使用到开发者的 API 密钥(即 SecretId 和 SecretKey)和 APPID。如果还未创建过密钥,请参见 创建密钥文档 生成新的 API 密钥;如果已创建过密钥,请参见 查看密钥文档 获取 API 密钥。在控制台 账号信息 页面可以查看 APPID,如下图所示:
步骤4:部署业务后台和 Web 页面
登录 步骤1准备的 CVM(登录方法详见 操作指南 – 登录 Linux),在远程终端输入以下命令并运行:
ubuntu@VM-69-2-ubuntu:~$ export SECRET_ID=AKxxxxxxxxxxxxxxxxxxxxxxx; export SECRET_KEY=xxxxxxxxxxxxxxxxxxxxx;export APPID=125xxxxxxx;git clone https://github.com/tencentyun/vod-server-demo.git ~/vod-server-demo; bash ~/vod-server-demo/installer/web_upload_scf.sh
说明:请将命令中的 SECRET_ID、SECRET_KEY 和 APPID 赋值为 步骤3 中获取到的内容。请确保已安装 Node.js 运行环境。该命令将从 Github 下载 Demo 源码并自动执行安装脚本。安装过程需几分钟(具体取决于 CVM 网络状况),期间远程终端会打印如下示例的信息:
[2020-04-25 23:03:20]开始检查npm。[2020-04-25 23:03:23]npm 安装成功。[2020-04-25 23:03:23]开始安装 ServerLess。[2020-04-25 23:03:26]serverless 安装成功。[2020-04-25 23:03:28]开始部署云点播客户端上传签名派发服务。[2020-04-25 23:03:40]云点播客户端上传签名派发服务部署完成。[2020-04-25 23:03:44]开始部署云点播 Web 上传页面。[2020-04-25 23:03:53]云点播 Web 上传页面部署完成。[2020-04-25 23:03:53]请在浏览器访问以下地址进行体验:https://service-xxxxxxxx-125xxxxxxx.gz.apigw.tencentcs.com/release/web_upload_html
复制输出日志中的 Web 页面地址(示例中的https://service-xxxxxxxx-125xxxxxxx.gz.apigw.tencentcs.com/release/web_upload_html
)。注意:如果输出日志中出现如下所示的警告,一般是由于 CVM 无法立即解析刚部署好的服务域名,可尝试忽略该警告。
[2020-04-25 17:18:44]警告:客户端上传签名派发服务测试不通过。
步骤5:体验 Web 上传 Demo
1. 在浏览器打开 步骤4 中复制的地址,即可开始体验 Web 上传 Demo。页面如下图所示:2. 在该页面进行视频上传操作:2.1 选择一个本地视频文件(推荐选择 MP4 文件)。2.2 选择一张本地封面图片(可选,使用 JPG 或者 PNG 格式)。2.3 填写视频名称(可选)。2.4 单击开始上传即可上传视频。
3. 上传完成后,页面下方会展示视频和封面的点播媒体 ID(即 fileId)和 URL 等信息。如下图所示:
4. 您可以在 云点播控制台 上查看刚上传的视频。如下图所示:
说明:您可根据页面提示,对上传页面的其它功能进行体验。
系统设计说明
接口协议及测试
上传页面和上传签名派发两个云函数都通过 API 网关对外提供接口,具体接口协议如下:
服务 | 云函数名 | 接口形式 | 返回内容 |
上传页面 | web_upload_html | HTTP GET | HTML 页面 |
上传签名派发 | ugc_upload_sign | HTTP POST | 上传签名 |
上传页面
您可以访问 SCF 服务列表 来查看上传页面服务的详细信息:
说明:Demo 使用的两个 SCF 部署在广州地域,命名空间为 vod_demo。控制台上需要选择对应地域和命名空间才能看到部署好的云函数。单击函数名,在左侧选择触发管理,右侧“访问路径”即是上传页面的 URL。单击API服务名即可跳转到对应的 API 网关页面。如下图所示:
测试该服务的方法为:在浏览器上直接访问页面 URL,正常情况下能看到上传页面。
上传签名派发
您可以访问 SCF 服务列表 来查看上传签名派发服务的详细信息(查看方法同 上传页面)。单击函数名,在左侧选择触发管理,右侧“访问路径”即是该服务的 URL。单击API服务名即可跳转到对应的 API 网关页面。如下图所示:
测试该服务的方法为:选择手动发送 HTTP 请求的方式,在一台有外网的 Linux 或者 Mac 上执行以下命令(请根据实际情况修改服务 URL):
curl -d '' https://service-xxxxxxxx-125xxxxxxx.gz.apigw.tencentcs.com/release/ugc_upload_sign
如果服务正常,则返回上传签名,签名示例如下:
VYapc9EYdoZLzGx0CglRW4N6kuhzZWNyZXRJZD1BS0lEZk5xMzl6dG5tYW1tVzBMOXFvZERia25hUjdZa0xPM1UmY3VycmVudFRpbWVTdGFtcD0xNTg4NTg4MDIzJmV4cGlyZVRpbWU9MTU4ODU4ODYyMyZyYW5kb209MTUwNzc4JmNsYXNzSWQ9MCZvbmVUaW1lVmFsaWQ9MCZ2b2RTdWJBcHBJZD0w
您也可以使用 Postman 等第三方工具来发送 HTTP 请求,具体用法请自行搜索。
上传页面服务代码解读
1. main_handler()
为入口函数。2. 读取web_upload.html
文件的内容,即上传页面内容。
html_file = open(HTML_FILE, encoding='utf-8') html = html_file.read()
3. 从config.json
中读取配置项。配置项是指您在编写 SCF 服务时无法预知,并且需要在部署过程中才能确定的内容。这些内容由部署脚本在部署上传页面服务之前实时写入到config.json
中。
conf_file = open(CONF_FILE, encoding='utf-8') conf = conf_file.read() conf_json = json.loads(conf)
4. 调用render_template
,根据上一步得到的配置信息对上传页面内容进行修改。配置项在config.json
文件中以"变量名": "取值"
的形式来表示;在web_upload.html
文件中以{变量名}
的形式来表示,修改时请替换为具体取值。详情如下:
def render_template(html, keys): """将 HTML 中的变量(形式为 ${变量名})替换为具体内容。""" for key, value in keys.items(): html = html.replace("${" + key + "}", value) return html
变量名 | 含义 | 取值类型 | 取值来源 |
UGC_UPLOAD_SIGN_SERVER | 上传签名派发服务的 URL | String | 上传签名派发服务部署完成后,由 SCF 命令行工具 scf 输出。 |
5. 将修改后的上传页面内容返回。返回的数据格式及含义请参见 云函数集成响应。
return { "isBase64Encoded": False, "statusCode": 200, "headers": {'Content-Type': 'text/html'}, "body": html }
上传签名派发服务代码解读
1. main_handler()
为入口函数。2. 调用parse_conf_file()
,从config.json
文件中读取配置信息。配置项说明如下(详细参数请参见 客户端上传签名参数):
字段 | 数据类型 | 功能 |
secret_id | String | API 密钥 |
secret_key | String | API 密钥 |
sign_expire_time | Integer | 签名有效时间,单位:秒 |
class_id | Integer | 视频上传完成后的分类 ID,0表示默认分类 |
otp | Integer | 签名是否单次有效 |
subappid | Integer | 是否上传到 云点播子应用 |
3. 调用parse_source_context()
,从请求 Body 中解析sourceContext
字段,用于在 上传完成事件通知 中透传给事件通知接收服务(本 Demo 暂未使用事件通知)。说明:在上传过程中该字段是可选的,如果您无需使用该功能,则可以忽略这部分代码。4. 调用generate_sign()
函数计算签名,详细算法请参见 客户端上传签名。5. 返回签名。返回的数据格式及含义请参见 云函数集成响应。
return { "isBase64Encoded": False, "statusCode": 200, "headers": {"Content-Type": "text/plain; charset=utf-8", "Access-Control-Allow-Origin": "*", "Access-Control-Allow-Methods": "POST,OPTIONS"}, "body": str(signature, 'utf-8') }
对音视频的解决方案有疑惑?想了解解决方案收费? 联系解决方案专家
腾讯云限时活动1折起,即将结束: 马上收藏
同尘科技为腾讯云授权服务中心,购买腾讯云享受折上折,更有现金返利:同意关联,立享优惠
阿里云解决方案也看看?: 点击对比阿里云的解决方案
暂无评论,你要说点什么吗?