实战丨如何把 Flutter 云端一体化做到极致?
发布于 4 年前 作者 qiang04 447 次浏览 来自 分享

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](/user/cloudbase)/cli

# 登录 CloudBase
cloudbase login

# 初始化 dart server 应用
cloudbase init --template dart

# 进入 dart server 应用根目录
cd dartapp

# 部署 dart server 到云上
cloudbase framework:deploy

部署成功

https://main.qcloudimg.com/raw/060f88845448cdbd0256125420a3dc7a.png

”>

访问服务:https://test-docker-117e45.service.tcloudbase.com/dartapp

2.2 开发简单的 API 接口

在创建的 dart server 应用内,打开 lib/channel.dart 文件,在 entryPoint() 函数里开发你的 API 接口。

[@override](/user/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](/user/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](/user/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](/user/cloudbase)/framework-plugin-dart",
        "inputs": {
          "serviceName": "dartapp",
          "servicePath": "/dartapp",
          "localPath": "./"
        }
      },
      "db": {
        "use": "[@cloudbase](/user/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,支持我们做得更好 ~ )

云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为开发者提供高可用、自动弹性扩缩的后端云服务,包含计算、存储、托管等serverless化能力,可用于云端一体化开发多种端应用(小程序,公众号,Web 应用,Flutter 客户端等),帮助开发者统一构建和管理后端服务和云资源,避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。

产品文档:https://cloud.tencent.com/product/tcb

技术文档:https://cloudbase.net

技术交流加Q群:601134960

最新资讯关注微信公众号【腾讯云云开发】

回到顶部