快速部署一个全景录制的应用到阿里云函数计算
- 🔥 通过 Serverless 应用中心 ，
该应用。
- 通过 Serverless Devs Cli 进行部署：
- 安装 Serverless Devs Cli 开发者工具 ，并进行授权信息配置 ；
- 初始化项目：
s init headless-ffmpeg -d headless-ffmpeg - 进入项目，并进行项目部署：
cd headless-ffmpeg && s deploy -y
# deploy
$ s deploy -y --use-local
# Invoke
$ s invoke -e '{"record_time":"60","video_url":"https://tv.cctv.com/live/cctv1/","output_file":"record2/test.mp4", "width":"1920", "height":"1080", "scale": 0.75}'调用成功后， 会在对应的 bucket 下， 产生 record/test.mp4 大约 60 秒 1920x1080 的全景录制视频。
其中参数的意义：
1.record_time: 录制时长
2.video_url: 录制视频的 url
3.width: 录制视频的宽度
4.height: 录制视频的高度
5.scale: 浏览器缩放比例
6.output_file: 最后录制视频保存的 OSS 目录
其中 scale 是对浏览器进行 75% 的缩放，使视频能录制更多的网页内容
注意: 如果您录制的视频存在一些卡顿或者快进， 可能是因为您录制的视频分辨率大并且复杂， 消耗的 CPU 很大， 您可以通过调大函数的规格， 提高 CPU 的能力。
比如上面的示例参数得到下图:
直接本地运行， 命令执行完毕后， 会在当前目录生成一个 test.mp4 的视频
$ docker run --rm --entrypoint="" -v $(pwd):/var/output aliyunfc/browser_recorder /code/record.sh 60 https://tv.cctv.com/live/cctv1 1920x1080x24 1920,1080 1920x1080 1
调试
# 如果有镜像有代码更新, 重新build 镜像
$ docker build -t my-headless-ffmpeg -f ./code/Dockerfile ./code
# 测试全屏录制核心脚本 record.sh, 执行完毕后， 会在当前目录有一个 test.mp4 的视频
$ docker run --rm --entrypoint="" -v $(pwd):/var/output my-headless-ffmpeg /code/record.sh 60 https://tv.cctv.com/live/cctv1 1920x1080x24 1920,1080 1920x1080 1其中 record.sh 的参数意义:
- 录制时长
- 视频 url
- $widthx$heightx24
- $width,$height
- $widthx$height
- chrome 浏览器缩放比例
Chrome 渲染到虚拟 X-server，并通过 FFmpeg 抓取系统桌⾯，通过启动 xvfb 启动虚拟 X-server，Chrome 进⾏全屏显示渲染到到虚拟 X-server 上，并通过 FFmpeg 抓取系统屏幕以及采集系统声⾳并进⾏编码写⽂件。这种⽅式的适配性⾮常好， 不仅可以录制 Chrome，理论上也可以录制其他的应⽤。缺点是占⽤的内存和 CPU 较多。
server.js
custom container http server 逻辑
record.sh
核心录屏逻辑， 启动 xvfb， 在虚拟 X-server 中使用 record.js 中的 puppeteer 启动浏览器， 最后 FFmpeg 完成 X-server 屏幕的视频和音频抓取工作， 生成全屏录制后的视频
如果您想将生成的视频直接预热的 CDN， 以阿里云 CDN 为例， 只需要在 server.js 上传完 OSS bucket 后的逻辑中增加如下代码：
Tips 前提需要配置好 CDN
您如果有关于错误的反馈或者未来的期待，您可以在 Serverless Devs repo Issues 中进行反馈和交流。如果您想要加入我们的讨论组或者了解 FC 组件的最新动态，您可以通过以下渠道进行：
 |
 |
 |
|---|---|---|
| 微信公众号：`serverless` | 微信小助手：`xiaojiangwh` | 钉钉交流群：`33947367` |