實戰丨如何把 Flutter 雲端一體化做到極致？
1. 背景
雲開發CloudBase 提供了強大的一站式後端服務，並且和微信團隊合作推出了「小程式·雲開發」，服務了超過 50 萬開發者。
我們還想把雲開發和 Flutter 結合，實現一套極致的 Flutter 雲端一體化工作流。此前，已經做過了一些探索：
-
實現雲開發的 Flutter SDK
Flutter客戶端可以使用雲開發 Flutter SDK，呼叫雲函式、雲資料庫和雲端儲存等後端資源。However, 雲函式不支援 dart 執行時，所以只有 baas 能力，沒有 faas 能力。
-
在 Serverless 雲應用內部署 dart server
Serverless 雲應用的底層是容器，可以支援任何語言，因此可以部署 dart server 雲應用，完善了雲端的開發能力。However，這裡還需要開發者理解容器服務，編寫 dockfile，還需要對 dart server 進行框架選型，有一定的研發門檻。
為了把雲端一體化做到極致，我們又做了 CloudBase Framework -- 一體化的應用開發部署工具，可以一鍵建立並部署 dart server 應用，並且支援宣告式的建立雲資源。
CloudBase Framework 已經在 Github 開源，歡迎大家給專案點個 Star
2. CloudBase Framework For Flutter 能做什麼 ？
2.1 快速建立並部署 dart server
藉助 CloudBase Framework，只需要幾行命令，就能開發一個免運維、自動擴縮容、高效能的 dart server 應用。
# 安裝 CLI 工具 npm install -g @cloudbase/cli # 登入 CloudBase cloudbase login # 初始化 dart server 應用 cloudbase init --template dart # 進入 dart server 應用根目錄 cd dartapp # 部署 dart server 到雲上 cloudbase framework:deploy
部署成功
訪問服務：https://test-docker-117e45.service.tcloudbase.com/dartapp
2.2 開發簡單的 API 介面
在建立的 dart server 應用內，開啟 lib/channel.dart 檔案，在 entryPoint() 函式裡開發你的 API 介面。
@override Controller get entryPoint { final router = Router(); router.route("/example").linkFunction((request) async { return Response.ok({"key": "value"}); }); return router; }
重新部署應用後，請求子路徑 /example
2.3 開箱即用的雲資料庫
我們在 dart server 應用裡集成了雲資料庫，只需要簡單修改程式碼，就可以呼叫資料庫。
通過 Flutter SDK 也可以在客戶端呼叫同一個雲資料庫
在 lib/channel.dart 檔案的 prepare() 函式裡初始化雲資料庫。
@override
Future prepare() async {
/// 其他初始化程式碼
...
/// 初始化雲資料庫
database = CloudBaseDatabase(CloudBaseCore.init({
/// 雲開發環境 ID
'env': 'your-env-id',
/// 騰訊雲 API 固定金鑰對
/// 獲取路徑: https://console.cloud.tencent.com/cam/capi
'secretId': 'your-secretId',
/// 同上
'secretKey': 'your-secretKey'
}));
}
在 entryPoint() 函式裡開發一個數據庫介面。
@override
Controller get entryPoint {
final router = Router();
/// 在請求裡使用雲資料庫
/// 雲資料庫詳細文件請參考: https://docs.cloudbase.net/api-reference/flutter/database.html
router.route("/user").linkFunction((request) async {
try {
/// 在 dart server 部署過程中已經宣告式的建立了 user 集合
final res = await database.collection('user').count();
/// 處理錯誤
if (res.code != null) {
return Response.serverError(
body: {"code": res.code, "message": res.message});
}
/// 回包
return Response.ok({"user_count": res.total});
} catch (err) {
return Response.serverError(body: err);
}
});
return router;
}
重新部署應用後，請求子路徑 /user
2.4 宣告式建立雲資源
在應用的配置檔案 cloudbaserc.json 裡，宣告兩個外掛：server 和 db。所以在一鍵部署的過程中，既建立了dart server應用，也建立了應用依賴的資料庫集合 user 。
{
"envId": "env-123",
"framework": {
"name": "aqueduct-starter",
"plugins": {
"server": {
"use": "@cloudbase/framework-plugin-dart",
"inputs": {
"serviceName": "dartapp",
"servicePath": "/dartapp",
"localPath": "./"
}
},
"db": {
"use": "@cloudbase/framework-plugin-database",
"inputs": {
"collections": [
{
"collectionName": "user",
"description": "使用者集合",
"aclTag": "PRIVATE"
}
]
}
}
}
}
}
2.5 更多
- 通過模板變數和模式切換，可以快速部署同一個應用到多個環境（體驗、預發、生產）
- 通過 Coding CI/CD 進行審批發布
更多可看技術文件https://cloudbase.net
3. CloudBase Framework 帶來的好處
3.1 降本增效
Flutter 開發者可以使用 CloudBase Framework 開發 API 介面服務，完成前後端業務的閉環，並且具備免運維、自動擴縮容的能力。
Flutter 雲端一體化的研發成本 = 傳統模式的研發成本 - 運維成本 - 前後端聯調成本 - 空閒資源成本
3.2 雲原生
「 Flutter x CloudBase Framework 」 是按照雲原生的思路打造的解決方案，是面向未來的解決方案，正是客戶端同學上雲的最佳實踐。
4. CloudBase Framework 的願景
4.1 成為 Flutter 開發工作流的一部分
目前藉助 CloudBase Framework 可以快速開發並上線 dart server 應用，Flutter 開發者可以自己完成前後端業務的閉環。
後續，希望可以和 Flutter 客戶端工程有更深入的整合，成為 Flutter 開發工作流的一部分。
4.2 助力更多團隊上雲
CloudBase Framework 是雲開發的一體化開發部署工具，可以幫忙開發者快速構建雲上應用，後續將持續優化體驗，支援更多功能，助力更多團隊上雲。
目前騰訊內部已有多個團隊在使用 CLoudBase Framework x Flutter 開發模式，研發效率提升了 100%
5. 寫在最後
5.1 開源貢獻
CloudBase Framework 專案已經在 Github 開源，歡迎各位開發者為 CloudBase Framework 共享一份力量，讓這個專案能夠更好的幫助開發者提升開發效率
https://github.com/TencentCloudBase/cloudbase-framework
（也歡迎給專案點個 Star，支援我們做得更好 ~ ）