前言

首先介紹下在本文出現的幾個比較重要的概念：

函數計算（Function Compute）: 函數計算是一個事件驅動的服務，通過函數計算，用戶無需管理服務器等運行情況，只需編寫代碼并上傳。函數計算準備計算資源，并以彈性伸縮的方式運行用戶代碼，而用戶只需根據實際代碼運行所消耗的資源進行付費。函數計算更多信息參考。
Fun: Fun 是一個用于支持 Serverless 應用部署的工具，能幫助您便捷地管理函數計算、API 網關、日志服務等資源。它通過一個資源配置文件（template.yml），協助您進行開發、構建、部署操作。Fun 的更多文檔參考。
fun install: fun install 是 fun 工具的一個子命令，用于安裝 pip 和 apt 依賴，提供了命令行接口和 fun.yml 描述文件兩種形式。

備注: 本文介紹的技巧需要 Fun 版本大于等于 2.9.3。

依賴工具

本項目是在 MacOS 下開發的，涉及到的工具是平臺無關的，對于 Linux 和 Windows 桌面系統應該也同樣適用。在開始本例之前請確保如下工具已經正確的安裝，更新到最新版本，并進行正確的配置。

• Docker
• Fun
• Fcli

Fun 和 Fcli 工具依賴于 docker 來模擬本地環境。

對于 MacOS 用戶可以使用?homebrew?進行安裝：

brew cask install docker brew tap vangie/formula brew install fun brew install fcli

Windows 和 Linux 用戶安裝請參考：

https://github.com/aliyun/fun/blob/master/docs/usage/installation.md

https://github.com/aliyun/fcli/releases

安裝好后，記得先執行?fun config?初始化一下配置。

初始化

使用 fun init 命令可以快捷的將本模板項目初始化到本地。

$ fun init vangie/puppeteer-example ? Please input oss bucket to upload chrome shell? chrome-headless ? Please select a region? cn-hangzhou ? Please input oss accessKeyId for upload? xxxxxxxxxxxKbBS ? Please input oss accessKeySecret for upload? xxxxxxxxxxxx5ZgM

上面會提示

輸入一個 OSS 的 BUCKET，注意 OSS Bucket 是全球唯一的，上面的 chrome-headless 已經被占用了，請換一個新的名稱或者一個已經創建好的（已經創建好的，請確保 region 一致）。

然后選擇一個 OSS 的 Region，請保持和部署函數計算 Region 一致

輸入一個具備 OSS 寫權限的秘鑰。

安裝依賴

$ fun install skip pulling image aliyunfc/runtime-nodejs8:build-1.2.0... Task => [UNNAMED]=> apt-get update (if need)=> apt-get install -y -d -o=dir::cache=/code/.fun/tmp libnss3=> bash -c 'for f in $(ls /code/.fun/tmp/archives/*.deb); do dpkg -x $f /code/.fun/root; done;'=> bash -c 'rm -rf /code/.fun/tmp/archives' Task => [UNNAMED]=> bash -c 'curl -L https://github.com/muxiangqiu/puppeteer-fc-starter-kit/raw/master/chrome/headless_shell.tar.gz --output headless_shell.tar.gz' ...

fun install 會執行 fun.yml 文件里的任務，這些任務會：

安裝 puppeteer 依賴的 .so 文件；

將 puppeteer 依賴的 chrome headless 二進制文件上傳到 OSS；

安裝 npm 依賴。

部署

$ fun deploy using region: cn-shanghai using accountId: ***********4733 using accessKeyId: ***********KbBS using timeout: 60Waiting for service puppeteer to be deployed...Waiting for function html2png to be deployed...Waiting for packaging function html2png code...package function html2png code donefunction html2png deploy success service puppeteer deploy success

執行

$ fcli function invoke -s puppeteer -f html2png The screenshot has been uploaded to http://chrome-headless.oss-cn-shanghai.aliyuncs.com/screenshot.png

打開上面的返回鏈接，看到截取出來的是全屏滾動的長圖，考慮的篇幅下面只截取了部分：

如果想換一個網址，可以使用如下命令格式

fcli function invoke -s puppeteer -f html2png --event-str 'http://www.alibaba.com'

調試

如果需要在本地調試代碼，可以使用如下命令

fun local invoke html2png <<<'http://www.alibaba.com'

?

原文鏈接
本文為云棲社區原創內容，未經允許不得轉載。

總結

以上是生活随笔為你收集整理的开发函数计算的正确姿势——网页截图服务的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。