如何把 Flutter 云端一体化做到极致?

时间:2022-07-22
本文章向大家介绍如何把 Flutter 云端一体化做到极致?,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

云开发 CloudBase 提供了强大的一站式后端服务,并且和微信团队合作推出了「小程序·云开发」,服务了超过 50 万开发者。

为了将云开发和 Flutter 结合,给开发者提供系统、高效的 Flutter 云端一体化工作流,此前,团队已经进行过一些探索:

Flutter客户端可以使用云开发 Flutter SDK,调用云函数、云数据库和云存储等后端资源。However, 云函数不支持 dart 运行时,所以只有 BaaS 能力,没有 FaaS 能力。

  • 在 Serverless 云应用内部署 dart server

Serverless 云应用的底层是容器,可以支持任何语言,因此可以部署 dart server 云应用,完善了云端的开发能力。然而,这里还需要开发者理解容器服务,编写 dockfile,并需要对 dart server 进行框架选型,有一定的研发门槛。

在此基础上,为了将云端一体化做到极致,我们研发了一体化的应用开发部署工具 CloudBase Framework,让开发者可以一键创建并部署 dart server 应用,并且支持声明式的创建云资源。

CloudBase Framework 已经在 Github 开源,欢迎大家扫码给项目点个Star。

CloudBase Framework for Flutter 能为开发者做什么?

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. 开发简单的 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。

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。

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"
            }
          ]
        }
      }
    }
  }
}

5. 更多

  • 通过模板变量和模式切换,可以快速部署同一个应用到多个环境(体验、预发、生产)
  • 通过 Coding CI/CD 进行审批发布

1. 降本增效

Flutter 开发者可以使用 CloudBase Framework 开发 API 接口服务,完成前后端业务的闭环,并且具备免运维、自动扩缩容的能力。

Flutter 云端一体化的研发成本 = 传统模式的研发成本 - 运维成本 - 前后端联调成本 - 空闲资源成本。

2. 云原生

「 Flutter x CloudBase Framework 」 是按照云原生思路打造的解决方案,是面向未来的解决方案,正是客户端同学上云的最佳实践。

1. 成为 Flutter 开发工作流的一部分

目前借助 CloudBase Framework 可以快速开发并上线 dart server 应用,Flutter 开发者可以自己完成前后端业务的闭环。

后续,希望可以和 Flutter 客户端工程有更深入的集成,成为 Flutter 开发工作流的一部分。

2. 助力更多团队上云

CloudBase Framework 是云开发的一体化开发部署工具,可以帮助开发者快速构建云上应用,后续将持续优化体验,支持更多功能,助力更多团队上云。

目前腾讯内部已有多个团队在使用 CloudBase Framework x Flutter 开发模式,研发效率提升近一倍。

追求极致,步履不停,云开发邀请各位开发者助力开源协同。

开源贡献

CloudBase Framework 项目已经在 Github 开源,欢迎各位开发者为 CloudBase Framework 贡献一份力量,让项目能更好地帮助开发者提升开发效率。

https://github.com/TencentCloudBase/cloudbase-framework

(也欢迎扫码给项目点个 Star,支持我们做得更好 ~ )

作者:周子杰,腾讯云云开发团队高级前端开发工程师。