雲開發 CLI 是一個開源的基於 Node 編寫的命令行工具,用於幫助用戶快速、方便的部署基於雲開發的項目、管理雲開發資源。
雲開發 CLI 支持環境配置、雲函數管理、文件管理、靜態網站管理、雲接入管理等多種能力,共計 50+ 的命令。雲開發 CLI 可以幫助你快速的創建、更新、測試雲函數,“一鍵” 部署靜態網站等,能有效加速你的開發效率。
雲開發支持下面的各種能力:
- 項目模板:爲了降低用戶使用 CloudBase CLI 進行項目開發的門檻,CloudBase CLI 提供了初始化命令幫助用戶初始化雲開發項目。CloudBase CLI 會獲取最新的模板列表,用戶可以選擇下載模板項目到本地,快速開始雲開發項目的開發。
- 配置文件:CloudBase CLI 使用配置文件簡化操作命名操作,當使用命令參數缺省時,CloudBase CLI 會從配置文件中解析相關參數並使用,方便開發者以更簡單的方式使用 CloudBase CLI。
- 環境操作:支持展示環境信息、修改 Web 安全域名、登錄方式配置等。
- 雲函數:支持部署、更新雲函數,修改雲函數配置,配置雲接入,刪除雲函數,本地調用雲函數,查看調用日誌等。
- 文件存儲:支持上傳、下載、刪除文件/文件夾等操作。
- 靜態網站:支持一個命令部署網站,也支持上傳、下載、刪除文件/文件夾等操作。
下面將以部署一個 React SPA Web 應用爲例,綜合應用雲開發的自定義登錄、雲函數、數據庫等功能,展示雲開發 CLI 的工程能力。
Demo 體驗鏈接:雲開發 Web 端實例。
操作步驟
1、準備
2、初始化項目
3、獲取配置
4、運行項目
5、部署
準備
npm install -g @cloudbase/cli
- 登錄
tcb login
初始化項目
CLI 提供了初始化命令幫助用戶初始化雲開發項目,運行 tcb init
命令,選擇下載 Node - React Web 示例模板
項目結構
下面是 React Web 示例的目錄結構, functions
目錄存放了項目中需要使用的雲函數,cloudbaserc.js
爲雲開發項目的配置文件,包含了環境 Id、雲函數配置等。
獲取配置
你需要到雲開發控制檯 https://console.cloud.tencent.com/tcb 獲取以下配置內容
環境 Id - envId
環境 Id 是每個雲開發環境的唯一標誌,可以在概覽頁面獲取
生成自定義登錄祕鑰
在這個例子中,我們要使用自定義登錄功能,實現 Web 端登錄,所以需要先下載自定義登錄祕鑰
獲取文件存儲的基本路徑
我們可以使用 tcb storage:upload
命令把 public 文件夾中的 icon.png 上傳到雲存儲中,並通過 tcb storage:url
獲取文件的訪問鏈接,如下圖所示
運行項目
這已經是一個完整的 Web 項目,在開始使用 CLI 工具部署此項目前,你需要把項目中 envId 等配置替換成你在上面獲取的配置。
配置
首先需要把 src/config/index.ts
中的 storageBaseUrl 換成 icon.png 鏈接的基礎地址,如:https://xxxx.tcb.qcloud.la
,鏈接不包含 icon.png,然後,把 functions/custom-login/config
中的 key 和 keyId 設置爲你獲取到到自定義登錄祕鑰中的 private_key
和 private_key_id
。
部署雲函數與創建數據庫集合
這裏我們藉助雲函數的能力來實現自定義登錄,在項目根目錄運行下面的命令來部署雲函數
tcb functions:deploy custom-login
下面,爲了方便的調用雲函數,我們可以使用雲函數的 HTTP 觸發功能,在函數配置中,設置 HTTP 觸發路徑,點擊保存,即可通過 HTTP 鏈接觸發雲函數
同理,運行下面的命令,部署 base64 函數
tcb functions:deploy base64
在控制檯,添加 demo_web 集合
安裝依賴與運行
最後,安裝依賴
yarn
運行
yarn run dev
訪問 localhost:3000,你可以看到下面的頁面
在使用雲開發的服務前,需要先進行登錄,在輸入框中輸入一個用戶名,點擊登錄按鈕,你可以看到登錄成功的提示。接下來你就可以點擊雲函數或數據庫菜單,體驗基於雲開發能力打造的示例。
部署
在本地開發完成後,我們可以使用雲開發的靜態託管服務部署我們的網站。靜態託管服務爲開發者提供靜態網頁託管的能力,需要在使用時單獨開通,進入靜態託管選項,點擊開始使用,即可進入開通流程,稍等幾分鐘即可開通完成。
在等待的時間裏,我們先構建網站 Demo,運行 yarn run build
打包雲開發 Web Demo,我們可以看到到了一個 build 目錄,即爲輸出結果。
在靜態網站開通完成後,我們可以直接使用 CLI 部署網站,運行
# 部署 build 目錄中所有的文件
tcb hosting:deploy build
命令執行完成後,進入靜態託管選項,可以看到 build 目錄中的文件已經上傳完成
!
進入設置選項,我們可以點擊默認域名鏈接,訪問部署完成的頁面。需要注意的是,默認域名僅供測試使用,限制訪問速度 10KB/S,所以展示速度會比較慢,需要耐心等待。這裏建議綁定自己的備案域名,加快訪問速度。
小結
雲開發 CLI 支持豐富的資源管理能力,簡化了雲函數部署、靜態網站部署、文件管理等操作流程,圍繞項目工程化,能有效加速你的項目迭代開發。
最後,歡迎大家使用雲開發
學習資料:
雲開發社區官網:www.cloudbase.net
快速安裝雲開發 CLI:https://docs.cloudbase.net/quick-start/install-cli.html