前言 在这个AI时代，结合AI做新的产品或基于你先有的业务加入AI能力，这个是趋势所在，那么如何更快的接入AI能力？接下给大家分享下云开发AI+的集成方式 步骤 登录微信云开发后台 https://tcb.cloud.tencent.com/cloud-admin?_tcbProviderId=mp [图片] 然后找到AI+菜单 [图片] 一共分为两块： 1.AI大模型：适用于快速接入大模型的基础AI对话能力 2.自定义AI能力：适用于具体业务的AI智能体搭建，支持知识库 接入AI大模型 我们先从AI大模型开始体验，进入AI大模型模块 [图片] 支持接入国内多家大模型，只需要填写Key即可，每家大模型服务后台获取方式可以去看各家的文档。 这边我使用的大模型是智谱，输入key后点击右上角保存，然后左边相关的模型会有个「已启用」状态，这个时候就配置好了。 我这边以小程序SDK为例： 第一步：先安装 npm 包 在小程序 package.json 所在的目录（一般是 miniprogram 目录）执行命令安装命令： [代码]npm i @cloudbase/js-sdk@2.8.3-beta.0[代码] 不会安装 npm 包请看《微信小程序如何引入npm包？》 第二步：初始化ai对象 [代码]const env = "填写你的环境ID"; registerAuth(cloudbase); registerAi(cloudbase); const app = cloudbase.init({ env }); const auth = app.auth({ persistence: "local" }); await auth.signInWithOpenId(); // 或者使用其他登录方式 const ai = await app.ai(); // 接下来就可以调用 ai 模块提供的创建模型等方法了 [代码] 然后你会看到控制台报错 [图片] 因为SDK中有请求域名需要在小程序后台配置即可或者可以在本地设置中勾选不校验。 [图片] 注意：勾选不校验目的是为了可以体验使用，如果要发布上线还是要在后台配置域名配置 第三步：使用AI大模型，推荐流式调用 [代码] const aiModel = ai.createModel("zhipu"); // 创建模型 const res = await aiModel.streamText({ model: "glm-4-plus", messages: [{ role: "user", content: "你好，请你介绍一下李白" }, ], }); for await (let str of res.textStream) { console.log(str); } [代码] 调用成功 [图片] 接入AI Agent 首先要先创建一个 Agent 智能体 [图片] 默认内置一些 Agent 模版，可以直接使用模版或者创新新的Agent，右边输入名称和介绍即可点击右下角「新建」。 [图片] 然后会进入编辑详情页面，一共分为三个区域，从左到右 Agent 列表区域，显示所有的Agent以及可以切换 编排 Agent 区域，支持设置人设和回复逻辑以及添加知识库、开场白、问题、问题建议 Agent 预览调试区域，当设置好 Agent 后可以在这个区域进行效果调试 [图片] 我们先来看下编排 Agent 区域「人设与回复约束」可以点击右边「生成」按钮自动生成提示词。 [图片] 点击使用即可应用，设置完成后可以在右边区域对话测试效果 [图片] 还可以为这个智能体添加知识库，点击【管理知识库】 [图片] 去新建输入标题和描述 [图片] 成功后会出现一个文件夹 [图片] 然后添加文件 [图片] 支持单个/多个添加文件 [图片] 比如我添加一个汽车故障常见问题的文档 [图片] 添加完成后会进入后状态会出现一个「文件解析中」转变成「文件解析写入完成」 [图片] 然后回到编辑页面进行添加知识库文件夹即可，剩下的就是一些基础配置开场白和预设提问。 [图片] 接下来我们测试下知识库设置完成后的效果，当我发送了刚才在文档中提到的“开门咯吱咯吱异响”问题后。 [图片] 它会在回答的最后面给出引用的知识库来源，这样就可以极大程度的避免大模型在具体内容上的幻觉问题。 [图片] 当我们全部配置完毕后那就可以直接去使用了，点击右上角的接入指引即可呼出发布文档。 发布 一共分为三种方式： 1.对接微信平台 2.小程序区块组件 3.SDK调用 推荐使用这两种方式对接微信平台和SDK调用，对接微信平台完全无代码更简单，SDK调用纯代码方式调用更灵活，如果你的应用场景不是对话模式那么可以用代码的方式植入你的业务流中。 对接微信平台： 支持小程序客服，微信客服，微信服务号，微信订阅号 [图片] 配置过程非常简单，只需要根据步骤设置AppID然后扫码授权即可完成。 小程序区块组件： 需要从主菜单切换到我的应用，创建一个空白应用 [图片] [图片] 然后会就进入微搭编辑页面，选择右边区块搜索「Agent」 [图片] 选择玩AgentUI之后配置ID [图片] ID在Agent详情名称有个复制ID功能 [图片] 配置ID后数据就会同步到这个UI组件上，你可以修改它的属性、事件、样式等 [图片] 全部修改完成之后我们可以选择Agent-UI组件，然后切换到配置这里可以直接下载代码包 [图片] 然后根据跟进文档就可以集成到你的小程序中 [图片] SDK调用： 不会安装 npm 包请看《微信小程序如何引入npm包？》 先建立连接 [代码]// 在开始之前，请确保完成配置了小程序 request 合法域名，详情请参考 https://docs.cloudbase.net/quick-start/baas/wx-mini // 在小程序 package.json 所在的目录（一般是 miniprogram 目录）执行命令安装 npm 包： // npm i @cloudbase/js-sdk@2.8.3-beta.0 // 安装完成后，点击微信开发者工具的菜单栏中「工具 -> 构建 npm」 // 引入 SDK，这里我们以分模块的形式按需引入了 cloudbase-js-sdk，也支持完整引入 import cloudbase from "@cloudbase/js-sdk/app"; import { registerAuth } from "@cloudbase/js-sdk/auth"; import { registerAi } from "@cloudbase/js-sdk/ai"; registerAuth(cloudbase); registerAi(cloudbase); const app = cloudbase.init({ env: "your-env", // 需替换为实际使用环境 id }); const auth = app.auth({ persistence: "local" }); await auth.signInWithOpenId(); // 或者使用其他登录方式 const ai = await app.ai(); // 接下来就可以调用 ai 模块提供的方法了 [代码] 指定具体Agent对话 [代码]const res = await ai.bot.sendMessage({ botId: "botId-xxx", msg: "给我一个成语。", }); for await (let str of res.textStream) { console.log(str); } // 当然 // 可以 // ！ // 这里 // 有一个 // 成语 [代码] 查看聊天记录 [代码]const res = await ai.bot.getChatRecords({ botId: "botId-xxx", pageNumber: 1, pageSize: 10, sort: "asc", }); // { // "recordList": [ // { // "botId": "bot-809d4ad1", // "recordId": "record-96617446", // "role": "user", // "content": "你好", // "conversation": "r3Hjz3qgms3UG7z9lwSYbA", // "type": "text", // "triggerSrc": "TCB" // }, // { // "botId": "bot-809d4ad1", // "recordId": "record-632906dd", // "role": "assistant", // "content": "您好！看起来您可能遇到了一些技术问题，或者只是想打个招呼。无论哪种情况，我都在这里为您提供帮助。如果您有任何具体的问题或需要协助，请随时告诉我！", // "conversation": "r3Hjz3qgms3UG7z9lwSYbA", // "type": "text", // "triggerSrc": "TCB" // } // ], // "total": 2 // } [代码] 到这里整个接入AI的流程就全部结束了。 最后 希望大家能跟上AI时代的步伐，做出自己的AI小程序，有问题欢迎留言讨论

前言 今天给大家带来的是云开发AI智能体，上篇《云开发之云模版CMS体验》文章提到了期待云模版有更多实用模板，这周云模版就更新了AI智能体应用，无需代码一句话搞定一个 AI 助手。 步骤 进入「微信开发者工具」-「云开发」控制台 [图片] 选择「云后台」-「去使用」 [图片] 进入云模板控制台选择「模板中心」 [图片] 进入「AI智能体应用」点右上角「安装」 [图片] 安装成功后切换到「关联资源」菜单「访问」管理后台 [图片] 默认会内置一些AI助手 [图片] 选择「分享」可以直接对话体验 [图片] 如果没有满意的AI助手可以通过「从模版创建」 [图片] 模板中还有 10 多AI助手供你选择 [图片] 选择后可以进入AI助手编辑详情页面 左边区域可以设置人设提示词 右边区域可以直接对话调试效果 [图片] 确认没问题点击「提交」就创建成功了 接下来再来一个自定义一个AI助手，选择「创建智能体」 [图片] 输入AI助手名称点击「确认」 [图片] 进入AI助手详情页，不会写人设提示词可以点击「获取AI建议」 [图片] AI会根据名称来生成一套专业的人设提示词，点击「使用AI建议」即可 [图片] 设定好AI助手人设后，可以在右边区域对话调试 [图片] 除此之外还可以设置AI助手的基础信息： 对外展示信息 头像 名称 简介 背景 开场白 欢迎语 推荐问题 [图片] [图片] 确认无误后点击「提交」就创建好了，可以「分享」给你的好友使用了 [图片] 电脑端效果： [图片] 手机端效果： [图片] 还支持在「对话」菜单中查看所有智能体的对话记录 [图片] 总结 整个体验下来，创建流程非常简单，只需要输入你要创建的AI助手名称即可生成，全程无需代码，赶紧去试试吧～ 发布到小程序/公众号已经在来的路上了，后续开放后我会更新相关体验文章。

[图片] // 题图由Noupload在Pixabay上发布 一体化部署工具介绍 https://cnodejs.org/topic/5f217ed24b61050e36e7d13b 1. 新版本发布 CloudBase Framework 0.7 版本已发布 https://github.com/TencentCloudBase/cloudbase-framework/releases/tag/0.7 更新日志： 新功能 Website 插件支持注入自定义环境变量 (#50) Website 插件自定义 pakcage 安装命令(#46) Node 插件支持 Vercel 类型应用(#49) Framework 内核支持自定义应用名 支持自动检测 Koa 应用（#52 ） 配置文件模板变量支持从进程环境变量传入 新增 Omi 应用模板 Bug 修复 修复 --verbose 参数输出 debug 日志失效的问题 修复部分 node 版本和 os 版本无法创建插件仓库的问题 升级新版 CLI 工具体验，在命令行执行 [代码]npm install -g @cloudbase/cli@latest [代码] 升级新版本，体验 CloudBase Framework 新功能～ 特性预览 1: Koa 应用自动检测 [图片] 特性预览 2: Website 插件支持自定义 package 安装命令 可以使用 tnpm, cnpm, yarn 等工具加速安装过程 特性预览 3: Website 插件支持注入自定义环境变量 [代码]{ "envId": "fx", "functionRoot": "cloudfunctions", "framework": { "name": "vue", "plugins": { "client": { "use": "@cloudbase/framework-plugin-website", "inputs": { "buildCommand": "npm run build", "outputPath": "dist", "cloudPath": "/vue", "envVariables": { "envId": "fx", "testEnv": "foo" } } }, } } } [代码] 2. 文档优化 新增注入「环境变量」的语法说明 （网站 /云应用 /函数） https://github.com/TencentCloudBase/cloudbase-framework/blob/master/doc/env-variables.md 新增 「应用模板」开发三要素文档（施工中） https://github.com/TencentCloudBase/cloudbase-framework/blob/master/doc/app.md 3. 新功能预告 CLI 工具支持从命令行一键导入 Github 应用项目 支持在线一键云端部署 GitHub 项目 部署错误日志细化，支持更加明确的日志输出 新增 Deno 插件 新增 PHP 插件 4. Contributors 新增 2 位贡献者，目前已有 14 名 Contributors，欢迎成为贡献者 https://github.com/TencentCloudBase/cloudbase-framework#contributors- 5. ⭐️ Github Star 当前 Github Star 数 344，欢迎 +1 支持 https://github.com/TencentCloudBase/cloudbase-framework [图片]扫码打开 Github 页面 6. CloudBase Framework 生态 云开发 CloudBase CMS 内容管理系统正式开源，基于 CloudBase Framework 一体化构建和部署 https://mp.weixin.qq.com/s/tTjZ0l0NmuBrFa0BEuTMgg 7. 小调查 你希望下一步 CloudBase Framework 提供怎样的功能升级或者优化

背景和介绍 云开发（CloudBase）是云端一体化的云服务平台，采用 serverless 架构，开发者无须关心服务器搭建和管理，只需要编写业务代码和调用原生提供的云能力，就可以快速搭建完整的小程序/小游戏、H5、Web、移动 App 等应用。云开发是国内 Serverless 理念的领先实践，服务了超过 50 万开发者。 在开发者使用云开发的过程中，我们收集到如下场景的反馈和需求： 存量业务如网站、后端服务希望能托管在云开发平台，但存在不小的改造成本 无法覆盖各种开发语言、框架和现有的应用交付方式 应用中存在前后端使用多种云开发资源时，希望能降低发布成本，同时实现持续交付 应用中添加其他云能力需要手动在控制台配置 基于以上的场景，我们希望设计一个工具来解决上述问题，希望具备以下的特性： 支持应用的无缝托管：用户不需要改变开发习惯，不需要修改代码适配云函数等云资源，而是可以直接将应用托管在云开发平台上 引入支持自定义的底层资源层：引入容器化的部署方案来承载各种开发语言、框架和现有的应用交付方式 支持声明式描述云资源：将应用内各个部分最终都能描述成统一的描述语言，支持前后端的统一部署 使用简单：使用者无须关心底层资源和底层声明文件等细节，只需要有限的业务参数，即可将应用一键托管到云开发平台 核心的思想就是希望让开发者使用一体化的方式来开发和部署应用 [图片] CloudBase Framework 是云开发基于上述一体化的思想开发的前后端一体化部署工具，开发者无需改动业务代码，支持前后端一键托管部署在云开发平台，享受加速访问和弹性免运维的优势，具有以下特点： 1. 云开发出品 由云开发推出，核心代码已在 Github 开源 https://github.com/TencentCloudBase/cloudbase-framework （欢迎给我们的项目点个 Star，支持我们做得更好～） [图片] 2. 云原生，一体化 前后端一体化部署在 Serverless 架构的云环境上，弹性可扩展 3. 降低成本 资源按使用自动弹性扩缩容，按照使用计费，极大节约资源成本 4. 高效快速 简单易用，并内置大量强大后端能力，只需要开发业务逻辑即可 亮点 1: 一键部署 CloudBase Framework 的第一个核心亮点是可以实现一键部署，常见的应用，不需要改动业务代码，即可“零配置”部署到云开发上。 [图片] [图片] 例如，图中所示的基于 Vue CLI 工具创建的项目，在执行 CloudBase Framework 的部署命令时，会自动检测项目框架和语言，交互式确认并保存项目配置，实现应用的一键发布。一条命令实现了应用部署，自动配置 COS 对象存储和 DNS、域名等，自带 HTTPS 安全访问、CDN 访问加速等能力。 支持常见框架和语言 [图片] [图片] CloudBase Framework 目前支持了 Vue、React 等前端框架，也支持 Nuxt 等 SSR 框架，基于 Node 开发的应用如 Express、Koa 等也可以一键托管。除此之外，借助底层 Serverless 云应用的能力，也可以部署其他后端的应用（PHP、Java、Go 等），值得一提的是可以部署 Dart Server，可以配合 Flutter 实现 Dart 语言的云端一体化，这也是国内云厂商对 Dart 语言和生态的一大补充。 自动检测框架 在降低用户使用门槛方面，我们实现了自动检测的功能，针对常见前端框架无需编写配置，可以实现自动识别项目的构建和发布默认配置 无需复杂适配 不需要学习复杂的服务器配置和更改代码，只需要输入业务参数即可部署 可配合 CI/CD 可以与您的现有工作流完美配合，可搭配 CI/ CD 工具实现持续部署，例如只需要几行代码就可以实现 Github 自动推送时自动部署应用前后端，同时也可以在 CI/CD 过程中增加手动确认步骤来 Review 发布过程。 [代码] - name: Deploy to CloudBase run: | npm i @cloudbase/cli cloudbase login --apiKeyId ${{secrets.SECRETID}} --apiKey ${{secrets.SECRETKEY}} cloudbase framework:deploy [代码] 亮点 2: 一体化，易扩展 平台一体化 云开发（CloudBase）是云端一体化的云服务平台，采用 serverless 架构，开发者无须关心服务器搭建和管理，原生提供了很多开箱即用的云能力 项目一体化 使用 CloudBase Framework 开发的项目前端、后端等都可以在同一个项目内开发和维护，这一点和小程序开发非常类似，可以在 IDE 内通过一体化的方式开发和发布。 [图片] 前后端一体化部署 如上面的例子所示，一个具备前端代码、云函数和服务端代码的一体化应用，只需要调用 CloudBase Framework 的一条命令，即可将完整应用部署在云端，统一管理和维护。 开箱即用的原生云能力 云开发一体化平台提供了开箱即用的原生的云能力，无需学习底层资源配置，无需运维和管理。 例如，在云开发平台上，我们需要部署静态网站，无须关心对象存储和 CDN 的管理；需要部署 HTTP 服务，无须关心网关层和计算资源的配置；需要使用云数据库时，我们也不用担心数据库实例的容灾。 轻松添加更多后端能力 可轻松引入更多开箱即用的后端能力 登录鉴权：通过 SDK 实现登录鉴权 云数据库：内置的 NoSQL 数据库，可通过声明式的方式来创建集合和索引 云接入：引入 HTTP 访问的支持 云调用：几行代码实现微信开放能力的调用 云函数：轻量级的计算能力 云存储：实现文件的存储和下载 Serverless 云应用：极简方式使用 Kubenetes 容器 扩展能力：可以免开发安装 CMS 内容管理系统等扩展能力 快速开始 安装 CloudBase CLI 首先需要安装 CloudBase 最新版命令行工具 [代码]npm install -g @cloudbase/cli@latest [代码] 登录命令行工具 然后调用命令行进行登录，会跳转到腾讯云控制台进行账号的授权，如果没有账号，可以在控制台进行开通 [代码]cloudbase login [代码] 初始化一个应用 通过 CloudBase 命令行工具我们可以非常方便地创建一个应用，如果在现有应用中使用，可以执行 [代码]cloudbase init --without-template[代码] [代码]cloudbase init [代码] 通过交互式地创建环境和选择模板来初始化应用 [图片] 也可以直接指定模板 id 创建对应的项目，例如 [代码]cloudbase init --template nuxt-ssr [代码] 目前支持的一体化应用模板如下： 名称 应用示例介绍 模板 id Vue 应用 Vue + 云函数 + 静态网站部署 [代码]vue[代码] React 应用 React + 云函数 + 静态网站部署 [代码]react-starter[代码] React 全栈应用 React + 云函数 + 静态网站部署+ 云数据库 [代码]react-demo[代码] Nuxt SPA 应用 Nuxt SPA + 云函数 + 静态网站部署 [代码]nuxt-spa[代码] Nuxt SSR 应用 Nuxt SSR + 服务端部署 + 静态网站部署 [代码]nuxt-ssr[代码] Koa 应用 Koa + 服务端部署 [代码]koa-starter[代码] Express 应用 Express + 服务端部署 [代码]express-starter[代码] Nest 应用 Nest + 服务端部署 [代码]nest-starter[代码] Node.js 云函数示例 Node.js 云函数 [代码]node-starter[代码] PHP 云函数示例 PHP 云函数 [代码]php-starter[代码] Java 云函数示例 Java 云函数 [代码]java-starter[代码] VuePresss 网站应用 VuePresss + 静态网站部署 [代码]vuepress[代码] Node.js 云应用 Node.js + Serverless 云应用部署 [代码]node[代码] Aqueduct (Dart Server) 云应用 Aqueduct (Dart Server) + Serverless 云应用部署 [代码]dart[代码] 部署应用 接下来，只需要进入到项目目录中调用命令进行部署 [代码]cloudbase framework:deploy [代码] [图片] 部署成功后，就可以通过命令行提示的地址进行访问了: https://framework.service.tcloudbase.com/express-starter/ CloudBase Framework 降本增效 CloudBase Framework 通过提供一体化的开发和部署功能，将应用轻松迁移到一体化的云开发平台上来。企业和个人开发者可以借助这套方案，提升业务效率，节省业务成本。 开发更快 集成云开发多端 SDK 开箱即用的后端能力 部署更快 一键部署，声明式创建云资源 自动、快速弹性扩缩容 访问更快 更多节点覆盖 高性能，高可用 云开发平台具备了免运维，全托管，按量付费的特点，通过 CloudBase 部署应用的成本相比传统方式部署应用的成本，节省了运维成本、闲置租用成本以及多角色沟通的成本。 [图片] 例如微信读书团队借助“小程序·云开发”带来了很大的效能提升，微信读书小程序上线 10 个月累计发布 349 次版本，开发效率分别是对应的 APP 和 H5 的 4 倍与 2 倍。 云开发还让其团队的分工和成员能力发生了显著变化。以前其团队按照前端开发、Node.js 开发和运维人员进行分工，现在前端负责全栈开发。 生态和插件 CloudBase Framework 具有开放性的特点，通过微内核、插件化的方式来设计这套方案。内核层面解决插件化、构建生命周期等问题，针对具体的场景则通过插件的方式来实现。 例如，针对不同技术栈的网站的托管，设计了 website 插件来处理这一类问题，可以解决前端页面构建、静态资源的部署以及域名的处理。 开发者也可以根据插件的规范来开发不同的插件发布到 NPM 上，使用时只需要指定其 npm 包名即可。 目前 CloudBase Framework 官方提供的插件有： 插件 最新版本 插件介绍 @cloudbase/framework-plugin-website [图片] 一键部署网站应用 @cloudbase/framework-plugin-node [图片] 一键部署 Node 应用（支持底层部署为函数或者 Serverless 云应用） @cloudbase/framework-plugin-nuxt [图片] 一键部署 Nuxt SSR 应用 @cloudbase/framework-plugin-function [图片] 一键部署函数资源 @cloudbase/framework-plugin-container [图片] 一键部署云应用容器服务 @cloudbase/framework-plugin-dart [图片] 一键部署 Dart 云应用 @cloudbase/framework-plugin-database [图片] 一键声明式部署云开发 NoSQL 云数据库 愿景 CloudBase Framework 致力于打造一体化框架，目前已实现了一体化的部署工具，未来会引入一体化运行时库和一体化 CI/CD 工作流，帮助业务更快更简单地将业务部署在面向未来的云开发平台上，提高效率，节省成本。 一体化思想 一体化平台 一体化部署工具 一体化运行时库：通过运行时框架简化开发流程，以更少的代码实现强大的功能 一体化 CI/CD 工作流：结合代码仓库推送，实现内置的自动化云端构建和部署 [图片] 开源贡献 我们非常欢迎各位开发者为 CloudBase Framework 贡献一份力量，让这个项目能够更好地帮助开发者提升效率。 Github 地址：https://github.com/TencentCloudBase/cloudbase-framework 参与贡献 积极参与 Issue 的讨论，如答疑解惑、提供想法或报告无法解决的错误 撰写和改进项目的文档 提交补丁优化代码 认领待办任务中的事项 目前已有 12 名 Contributors https://github.com/TencentCloudBase/cloudbase-framework#contributors- CloudBase Framework 近期上线新功能 支持使用 buildCommand 自定义构建命令 支持 Egg 、Next 等约定目录而不是直接导入文件的 Node 框架 cloudbaserc 配置文件支持模板变量，可以支持一份配置，支持多种变量注入 支持指定模式 [代码]mode[代码] 来选择不同的配置，例如 cloudbase framework:deploy --mode production 提升插件安装和依赖安装速度，部署速度更快 🚀 支持自动检测 Dockerfile 项目生成云应用配置 云应用插件支持注入环境变量 支持自动检测 Hexo 、Gatsbyjs 项目 功能预告 CloudBase Framework 支持在线一键云端部署 GitHub 项目 CloudBase Framework 部署错误日志细化，支持更加明确的日志输出 CloudBase Framework 支持新增 PHP 插件 CloudBase Framework Node 插件支持日志查看功能 小调查 你希望下一步 CloudBase Framework 提供怎样的功能升级或者优化？

CloudBase Framework工具推荐：前后端一体化部署,效能提升开源“神器” 背景和介绍 云开发 CloudBase是云端一体化的云服务平台，采用 serverless 架构，开发者无须关心服务器搭建和管理，只需要编写业务代码和调用原生提供的云能力，就可以快速搭建完整的小程序/小游戏、H5、Web、移动 App 等应用。云开发是国内 Serverless 理念的领先实践，服务了超过 50 万开发者。 在开发者使用云开发的过程中，我们收集到如下场景的反馈和需求： 存量业务如网站、后端服务希望能托管在云开发平台，但存在不小的改造成本 无法覆盖各种开发语言、框架和现有的应用交付方式 应用中存在前后端使用多种云开发资源时，希望能降低发布成本，同时实现持续交付 应用中添加其他云能力需要手动在控制台配置 基于以上的场景，我们希望设计一个工具来解决上述问题，希望具备以下的特性： 支持应用的无缝托管：用户不需要改变开发习惯，不需要修改代码适配云函数等云资源，而是可以直接将应用托管在云开发平台上 引入支持自定义的底层资源层：引入容器化的部署方案来承载各种开发语言、框架和现有的应用交付方式 支持声明式描述云资源：将应用内各个部分最终都能描述成统一的描述语言，支持前后端的统一部署 使用简单：使用者无须关心底层资源和底层声明文件等细节，只需要有限的业务参数，即可将应用一键托管到云开发平台 核心的思想就是希望让开发者使用一体化的方式来开发和部署应用。 [图片] CloudBase Framework 是云开发基于上述一体化的思想开发的前后端一体化部署工具，开发者无需改动业务代码，支持前后端一键托管部署在云开发平台，享受加速访问和弹性免运维的优势，具有以下特点： 1. 云开发出品 由云开发推出，核心代码已在 Github 开源 https://github.com/TencentCloudBase/cloudbase-framework （欢迎给我们的项目点个 Star，支持我们做得更好～） [图片] 2. 云原生，一体化 前后端一体化部署在 Serverless 架构的云环境上，弹性可扩展 3. 降低成本 资源按使用自动弹性扩缩容，按照使用计费，极大节约资源成本 4. 高效快速 简单易用，并内置大量强大后端能力，只需要开发业务逻辑即可 下文将详细介绍 CloudBase Framework 的核心特性以及快速开始攻略。 亮点 1: 一键部署 CloudBase Framework 的第一个核心亮点是可以实现一键部署，常见的应用，不需要改动业务代码，即可“零配置”部署到云开发上。 [图片] 例如，图中所示的基于 Vue CLI 工具创建的项目，在执行 CloudBase Framework 的部署命令时，会自动检测项目框架和语言，交互式确认并保存项目配置，实现应用的一键发布。一条命令实现了应用部署，自动配置 COS 对象存储和 DNS、域名等，自带 HTTPS 安全访问、CDN 访问加速等能力。 支持常见框架和语言 [图片] CloudBase Framework 目前支持了 Vue、React 等前端框架，也支持 Nuxt 等 SSR 框架，基于 Node 开发的应用如 Express、Koa 等也可以一键托管。除此之外，借助底层 Serverless 云应用的能力，也可以部署其他后端的应用（PHP、Java、Go 等），值得一提的是可以部署 Dart Server，可以配合 Flutter 实现 Dart 语言的云端一体化，这也是国内云厂商对 Dart 语言和生态的一大补充。 自动检测框架 在降低用户使用门槛方面，我们实现了自动检测的功能，针对常见前端框架无需编写配置，可以实现自动识别项目的构建和发布默认配置 无需复杂适配 不需要学习复杂的服务器配置和更改代码，只需要输入业务参数即可部署 可配合 CI/CD 可以与您的现有工作流完美配合，可搭配 CI/ CD 工具实现持续部署，例如只需要几行代码就可以实现 Github 自动推送时自动部署应用前后端，同时也可以在 CI/CD 过程中增加手动确认步骤来 Review 发布过程。 [代码] - name: Deploy to CloudBase run: | npm i @cloudbase/cli cloudbase login --apiKeyId ${{secrets.SECRETID}} --apiKey ${{secrets.SECRETKEY}} cloudbase framework:deploy [代码] 亮点 2: 一体化，易扩展 平台一体化 云开发（CloudBase）是云端一体化的云服务平台，采用 serverless 架构，开发者无须关心服务器搭建和管理，原生提供了很多开箱即用的云能力 项目一体化 使用 CloudBase Framework 开发的项目前端、后端等都可以在同一个项目内开发和维护，这一点和小程序开发非常类似，可以在 IDE 内通过一体化的方式开发和发布。 [图片] 前后端一体化部署 如上面的例子所示，一个具备前端代码、云函数和服务端代码的一体化应用，只需要调用 CloudBase Framework 的一条命令，即可将完整应用部署在云端，统一管理和维护。 开箱即用的原生云能力 云开发一体化平台提供了开箱即用的原生的云能力，无需学习底层资源配置，无需运维和管理。 例如，在云开发平台上，我们需要部署静态网站，无须关心对象存储和 CDN 的管理；需要部署 HTTP 服务，无须关心网关层和计算资源的配置；需要使用云数据库时，我们也不用担心数据库实例的容灾。 轻松添加更多后端能力 可轻松引入更多开箱即用的后端能力 登录鉴权：通过 SDK 实现登录鉴权 云数据库：内置的 NoSQL 数据库，可通过声明式的方式来创建集合和索引 云接入：引入 HTTP 访问的支持 云调用：几行代码实现微信开放能力的调用 云函数：轻量级的计算能力 云存储：实现文件的存储和下载 Serverless 云应用：极简方式使用 Kubenetes 容器 扩展能力：可以免开发安装 CMS 内容管理系统等扩展能力 更多技术文档：https://cloudbase.net?from=10004 降本增效 CloudBase Framework 通过提供一体化的开发和部署功能，将应用轻松迁移到一体化的云开发平台上来。企业和个人开发者可以借助这套方案，提升业务效率，节省业务成本。 开发更快 集成云开发多端 SDK 开箱即用的后端能力 [图片] 部署更快 一键部署，声明式创建云资源 自动、快速弹性扩缩容 [图片] 访问更快 更多节点覆盖 高性能，高可用 在 50 万开发者，每日调用量 7 亿的规模下，可用性保障可以做到 99.90% [图片] 省心更省钱 云开发平台具备了免运维，全托管，按量付费的特点，通过 CloudBase 部署应用的成本相比传统方式部署应用的成本，节省了运维成本、闲置租用成本以及多角色沟通的成本。 [图片] 例如微信读书团队借助“小程序·云开发”带来了很大的效能提升，微信读书小程序上线 10 个月累计发布 349 次版本，开发效率分别是对应的 APP 和 H5 的 4 倍与 2 倍。 云开发还让其团队的分工和成员能力发生了显著变化。以前其团队按照前端开发、Node.js 开发和运维人员进行分工，现在前端负责全栈开发。 生态和插件 CloudBase Framework 具有开放性的特点，通过微内核、插件化的方式来设计这套方案。内核层面解决插件化、构建生命周期等问题，针对具体的场景则通过插件的方式来实现。 例如，针对不同技术栈的网站的托管，设计了 website 插件来处理这一类问题，可以解决前端页面构建、静态资源的部署以及域名的处理。 开发者也可以根据插件的规范来开发不同的插件发布到 NPM 上，使用时只需要指定其 npm 包名即可。 目前 CloudBase Framework 官方提供的插件有： 插件 最新版本 插件介绍 @cloudbase/framework-plugin-website [图片] 一键部署网站应用 @cloudbase/framework-plugin-node [图片] 一键部署 Node 应用（支持底层部署为函数或者 Serverless 云应用） @cloudbase/framework-plugin-nuxt [图片] 一键部署 Nuxt SSR 应用 @cloudbase/framework-plugin-function [图片] 一键部署函数资源 @cloudbase/framework-plugin-container [图片] 一键部署云应用容器服务 @cloudbase/framework-plugin-dart [图片] 一键部署 Dart 云应用 @cloudbase/framework-plugin-database [图片] 一键声明式部署云开发 NoSQL 云数据库 快速开始 安装 CloudBase CLI 首先需要安装 CloudBase 最新版命令行工具 [代码]npm install -g @cloudbase/cli@latest [代码] 登录命令行工具 然后调用命令行进行登录，会跳转到腾讯云控制台进行账号的授权，如果没有账号，可以在控制台进行开通 [代码]cloudbase login [代码] 初始化一个应用 通过 CloudBase 命令行工具我们可以非常方便地创建一个应用，如果在现有应用中使用，可以执行 [代码]cloudbase init --without-template[代码] [代码]cloudbase init [代码] 通过交互式地创建环境和选择模板来初始化应用 [图片] 也可以直接指定模板 id 创建对应的项目，例如 [代码]cloudbase init --template nuxt-ssr [代码] 目前支持的一体化应用模板如下： 名称 应用示例介绍 模板 id Vue 应用 Vue + 云函数 + 静态网站部署 [代码]vue[代码] React 应用 React + 云函数 + 静态网站部署 [代码]react-starter[代码] React 全栈应用 React + 云函数 + 静态网站部署+ 云数据库 [代码]react-demo[代码] Nuxt SPA 应用 Nuxt SPA + 云函数 + 静态网站部署 [代码]nuxt-spa[代码] Nuxt SSR 应用 Nuxt SSR + 服务端部署 + 静态网站部署 [代码]nuxt-ssr[代码] Koa 应用 Koa + 服务端部署 [代码]koa-starter[代码] Express 应用 Express + 服务端部署 [代码]express-starter[代码] Nest 应用 Nest + 服务端部署 [代码]nest-starter[代码] Node.js 云函数示例 Node.js 云函数 [代码]node-starter[代码] PHP 云函数示例 PHP 云函数 [代码]php-starter[代码] Java 云函数示例 Java 云函数 [代码]java-starter[代码] VuePresss 网站应用 VuePresss + 静态网站部署 [代码]vuepress[代码] Node.js 云应用 Node.js + Serverless 云应用部署 [代码]node[代码] Aqueduct (Dart Server) 云应用 Aqueduct (Dart Server) + Serverless 云应用部署 [代码]dart[代码] 部署应用 接下来，只需要进入到项目目录中调用命令进行部署 [代码]cloudbase framework:deploy [代码] [图片] 部署成功后，就可以通过命令行提示的地址进行访问了: https://framework.service.tcloudbase.com/express-starter/ 愿景 CloudBase Framework 致力于打造一体化框架，目前已实现了一体化的部署工具，未来会引入一体化运行时库和一体化 CI/CD 工作流，帮助业务更快更简单地将业务部署在面向未来的云开发平台上，提高效率，节省成本。 一体化思想 一体化平台 一体化部署工具 一体化运行时库：通过运行时框架简化开发流程，以更少的代码实现强大的功能 一体化 CI/CD 工作流：结合代码仓库推送，实现内置的自动化云端构建和部署 [图片] 开源贡献 我们非常欢迎各位开发者为 CloudBase Framework 贡献一份力量，让这个项目能够更好地帮助开发者提升效率。 Github 地址：https://github.com/TencentCloudBase/cloudbase-framework 参与贡献 积极参与 Issue 的讨论，如答疑解惑、提供想法或报告无法解决的错误 撰写和改进项目的文档 提交补丁优化代码 认领待办任务中的事项 云开发（Tencent CloudBase，TCB）是腾讯云提供的云原生一体化开发环境和工具平台，为开发者提供高可用、自动弹性扩缩的后端云服务，包含计算、存储、托管等serverless化能力，可用于云端一体化开发多种端应用（小程序，公众号，Web 应用，Flutter 客户端等），帮助开发者统一构建和管理后端服务和云资源，避免了应用开发过程中繁琐的服务器搭建及运维，开发者可以专注于业务逻辑的实现，开发门槛更低，效率更高。 产品文档：https://cloud.tencent.com/product/tcb 技术文档：https://cloudbase.net 技术交流加Q群：601134960 最新资讯关注微信公众号【腾讯云云开发】

了解了下小程序的云开发，作为一个经常要跟后端沟通来沟通去的前端同学来说(很烦)，的确是个利好的创新啊。 但是做过实际商业项目的都知道，只要是有实际的业务，就肯定有一个后台管理系统，小程序云开发的初衷是为了弱化后端服务和运维，但也不能少啊，一个小程序做出来，客户没有后台管理系统，他们岂不是要质疑你的专业程度？他们没法用啊。比如我要上传产品、修改用户信息等等。 云开发提供的一个简单的可视化数据面板肯定满足不了实际的管理需求，希望官方能够出一个通用的或者可以定制主题的后台管理系统，支持WEB端就好，不然就显得云开发鸡肋了，只能做做个人项目和简单的小程序，商业使用是没有前景了。望官方攻城狮们采纳，不胜感激。

众所周知，小程序当中有一类特殊的内置组件——原生组件，这类组件有别于 WebView 渲染的内置组件，他们是交由原生客户端渲染的。原生组件作为 Webview 的补充，为小程序带来了更丰富的特性和更高的性能，但同时由于脱离 Webview 渲染也给开发者带来了不小的困扰。在小程序引入「同层渲染」之前，原生组件的层级总是最高，不受 [代码]z-index[代码] 属性的控制，无法与 [代码]view[代码]、[代码]image[代码] 等内置组件相互覆盖， [代码]cover-view[代码] 和 [代码]cover-image[代码] 组件的出现一定程度上缓解了覆盖的问题，同时为了让原生组件能被嵌套在 [代码]swiper[代码]、[代码]scroll-view[代码] 等容器内，小程序在过去也推出了一些临时的解决方案。但随着小程序生态的发展，开发者对原生组件的使用场景不断扩大，原生组件的这些问题也日趋显现，为了彻底解决原生组件带来的种种限制，我们对小程序原生组件进行了一次重构，引入了「同层渲染」。 相信已经有不少开发者已经在日常的小程序开发中使用了「同层渲染」的原生组件，那么究竟什么是「同层渲染」？它背后的实现原理是怎样的？它是解决原生组件限制的银弹吗？本文将会为你一一解答这些问题。 什么是「同层渲染」? 首先我们先来了解一下小程序原生组件的渲染原理。我们知道，小程序的内容大多是渲染在 WebView 上的，如果把 WebView 看成单独的一层，那么由系统自带的这些原生组件则位于另一个更高的层级。两个层级是完全独立的，因此无法简单地通过使用 [代码]z-index[代码] 控制原生组件和非原生组件之间的相对层级。正如下图所示，非原生组件位于 WebView 层，而原生组件及 [代码]cover-view[代码] 与 [代码]cover-image[代码] 则位于另一个较高的层级： [图片] 那么「同层渲染」顾名思义则是指通过一定的技术手段把原生组件直接渲染到 WebView 层级上，此时「原生组件层」已经不存在，原生组件此时已被直接挂载到 WebView 节点上。你几乎可以像使用非原生组件一样去使用「同层渲染」的原生组件，比如使用 [代码]view[代码]、[代码]image[代码] 覆盖原生组件、使用 [代码]z-index[代码] 指定原生组件的层级、把原生组件放置在 [代码]scroll-view[代码]、[代码]swiper[代码]、[代码]movable-view[代码] 等容器内，通过 [代码]WXSS[代码] 设置原生组件的样式等等。启用「同层渲染」之后的界面层级如下图所示： [图片] 「同层渲染」原理 你一定也想知道「同层渲染」背后究竟采用了什么技术。只有真正理解了「同层渲染」背后的机制，才能更高效地使用好这项能力。实际上，小程序的同层渲染在 iOS 和 Android 平台下的实现不同，因此下面分成两部分来分别介绍两个平台的实现方案。 iOS 端 小程序在 iOS 端使用 WKWebView 进行渲染的，WKWebView 在内部采用的是分层的方式进行渲染，它会将 WebKit 内核生成的 Compositing Layer（合成层）渲染成 iOS 上的一个 WKCompositingView，这是一个客户端原生的 View，不过可惜的是，内核一般会将多个 DOM 节点渲染到一个 Compositing Layer 上，因此合成层与 DOM 节点之间不存在一对一的映射关系。不过我们发现，当把一个 DOM 节点的 CSS 属性设置为 [代码]overflow: scroll[代码] （低版本需同时设置 [代码]-webkit-overflow-scrolling: touch[代码]）之后，WKWebView 会为其生成一个 [代码]WKChildScrollView[代码]，与 DOM 节点存在映射关系，这是一个原生的 [代码]UIScrollView[代码] 的子类，也就是说 WebView 里的滚动实际上是由真正的原生滚动组件来承载的。WKWebView 这么做是为了可以让 iOS 上的 WebView 滚动有更流畅的体验。虽说 [代码]WKChildScrollView[代码] 也是原生组件，但 WebKit 内核已经处理了它与其他 DOM 节点之间的层级关系，因此你可以直接使用 WXSS 控制层级而不必担心遮挡的问题。 小程序 iOS 端的「同层渲染」也正是基于 [代码]WKChildScrollView[代码] 实现的，原生组件在 attached 之后会直接挂载到预先创建好的 [代码]WKChildScrollView[代码] 容器下，大致的流程如下： 创建一个 DOM 节点并设置其 CSS 属性为 [代码]overflow: scroll[代码] 且 [代码]-webkit-overflow-scrolling: touch[代码]； 通知客户端查找到该 DOM 节点对应的原生 [代码]WKChildScrollView[代码] 组件； 将原生组件挂载到该 [代码]WKChildScrollView[代码] 节点上作为其子 View。 [图片] 通过上述流程，小程序的原生组件就被插入到 [代码]WKChildScrollView[代码] 了，也即是在 [代码]步骤1[代码] 创建的那个 DOM 节点对应的原生 ScrollView 的子节点。此时，修改这个 DOM 节点的样式属性同样也会应用到原生组件上。因此，「同层渲染」的原生组件与普通的内置组件表现并无二致。 Android 端 小程序在 Android 端采用 chromium 作为 WebView 渲染层，与 iOS 不同的是，Android 端的 WebView 是单独进行渲染而不会在客户端生成类似 iOS 那样的 Compositing View (合成层)，经渲染后的 WebView 是一个完整的视图，因此需要采用其他的方案来实现「同层渲染」。经过我们的调研发现，chromium 支持 WebPlugin 机制，WebPlugin 是浏览器内核的一个插件机制，主要用来解析和描述embed 标签。Android 端的同层渲染就是基于 [代码]embed[代码] 标签结合 chromium 内核扩展来实现的。 [图片] Android 端「同层渲染」的大致流程如下: WebView 侧创建一个 [代码]embed[代码] DOM 节点并指定组件类型； chromium 内核会创建一个 [代码]WebPlugin[代码] 实例，并生成一个 [代码]RenderLayer[代码]； Android 客户端初始化一个对应的原生组件； Android 客户端将原生组件的画面绘制到步骤2创建的 [代码]RenderLayer[代码] 所绑定的 [代码]SurfaceTexture[代码] 上； 通知 chromium 内核渲染该 [代码]RenderLayer[代码]； chromium 渲染该 [代码]embed[代码] 节点并上屏。 [图片] 这样就实现了把一个原生组件渲染到 WebView 上，这个流程相当于给 WebView 添加了一个外置的插件，如果你有留意 Chrome 浏览器上的 pdf 预览，会发现实际上它也是基于 [代码]<embed />[代码] 标签实现的。 这种方式可以用于 map、video、canvas、camera 等原生组件的渲染，对于 input 和 textarea，采用的方案是直接对 chromium 的组件进行扩展，来支持一些 WebView 本身不具备的能力。 对比 iOS 端的实现，Android 端的「同层渲染」真正将原生组件视图加到了 WebView 的渲染流程中且 embed 节点是真正的 DOM 节点，理论上可以将任意 WXSS 属性作用在该节点上。Android 端相对来说是更加彻底的「同层渲染」，但相应的重构成本也会更高一些。 「同层渲染」 Tips 通过上文我们已经了解了「同层渲染」在 iOS 和 Android 端的实现原理。Android 端的「同层渲染」是基于 chromium 内核开发的扩展，可以看成是 webview 的一项能力，而 iOS 端则需要在使用过程中稍加注意。以下列出了若干注意事项，可以帮助你避免踩坑： Tips 1. 不是所有情况均会启用「同层渲染」 需要注意的是，原生组件的「同层渲染」能力可能会在特定情况下失效，一方面你需要在开发时稍加注意，另一方面同层渲染失败会触发 [代码]bindrendererror[代码] 事件，可在必要时根据该回调做好 UI 的 fallback。根据我们的统计，目前同层失败率很低，也不需要太过于担心。 对 Android 端来说，如果用户的设备没有微信自研的 [代码]chromium[代码] 内核，则会无法切换至「同层渲染」，此时会在组件初始化阶段触发 [代码]bindrendererror[代码]。而 iOS 端的情况会稍复杂一些：如果在基础库创建同层节点时，节点发生了 WXSS 变化从而引起 WebKit 内核重排，此时可能会出现同层失败的现象。解决方法：应尽量避免在原生组件上频繁修改节点的 WXSS 属性，尤其要尽量避免修改节点的 [代码]position[代码] 属性。如需对原生组件进行变换，强烈推荐使用 [代码]transform[代码] 而非修改节点的 [代码]position[代码] 属性。 Tips 2. iOS 「同层渲染」与 WebView 渲染稍有区别 上文我们已经了解了 iOS 端同层渲染的原理，实际上，WebKit 内核并不感知原生组件的存在，因此并非所有的 WXSS 属性都可以在原生组件上生效。一般来说，定位 (position / margin / padding) 、尺寸 (width / height) 、transform (scale / rotate / translate) 以及层级 (z-index) 相关的属性均可生效，在原生组件外部的属性 (如 shadow、border) 一般也会生效。但如需对组件做裁剪则可能会失败，例如：[代码]border-radius[代码] 属性应用在父节点不会产生圆角效果。 Tips 3. 「同层渲染」的事件机制 启用了「同层渲染」之后的原生组件相比于之前的区别是原生组件上的事件也会冒泡，意味着，一个原生组件或原生组件的子节点上的事件也会冒泡到其父节点上并触发父节点的事件监听，通常可以使用 [代码]catch[代码] 来阻止原生组件的事件冒泡。 Tips 4. 只有子节点才会进入全屏 有别于非同层渲染的原生组件，像 [代码]video[代码] 和 [代码]live-player[代码] 这类组件进入全屏时，只有其子节点会被显示。 [图片] 总结 阅读本文之后，相信你已经对小程序原生组件的「同层渲染」有了更深入的理解。同层渲染不仅解决了原生组件的层级问题，同时也让原生组件有了更丰富的展示和交互的能力。下表列出的原生组件都已经支持了「同层渲染」，其他组件（ textarea、camera、webgl 及 input）也会在近期逐步上线。现在你就可以试试用「同层渲染」来优化你的小程序了。 支持同层渲染的原生组件 最低版本 video v2.4.0 map v2.7.0 canvas 2d（新接口） v2.9.0 live-player v2.9.1 live-pusher v2.9.1

[图片] 微信官方为提升小程序模板消息能力的使用体验，对模板消息的下发条件进行了调整。原有的小程序模板消息接口于 2020 年 1 月 10 日下线，届时将无法使用旧的小程序模板消息接口发送模板消息，取而代之的是新的一次性订阅消息和长期订阅消息。 订阅消息给小程序开发者带来了更好的触达用户的能力，在具体实施过程中，开发者如何把模板消息换成新的订阅消息，是否需要购买服务器来实现服务器鉴权，怎样才能在用户订阅之后一段时间后，给用户发送长期或一次性订阅消息呢？ 小程序·云开发最近支持了通过云调用免 access_token 发送订阅消息，还新增支持了在定时触发器中实现云调用，这些能力可以帮助开发者轻松玩转小程序订阅消息。 我们今天会利用小程序·云开发进行一个小程序中实现订阅开课提醒的实战，帮助大家了解如何基于小程序·云开发快速接入小程序订阅消息。 [图片]整体时序图[图片]开课提醒订阅消息时序图环境准备注册小程序帐号[1]开通云开发服务[2]获取订阅消息模板 ID在微信小程序管理后台中，新增一个订阅消息的模板，这里我们新增了一个开课提醒的模板。 [图片]新增模板引导用户订阅微信小程序提供了[代码]wx.requestSubscribeMessage[代码] 接口来发起申请订阅权限界面。 [图片]微信申请订阅权限界面在 "订阅开课提醒" 的按钮上绑定 tap 事件，事件处理器我们这里用的 [代码]onSubscribe[代码] index.wxml [代码]<button  class="btn"  data-item="{{ item }}"  bindtap="onSubscribe"  hover-class="btn-hover" >  订阅开课提醒 </button> [代码]在 [代码]onSubscribe[代码] 函数内，我们会调用微信 API [代码]wx.requestSubscribeMessage[代码] 申请发送订阅消息权限，当用户在弹窗同意订阅之后，我们会收到 [代码]success[代码] 回调，将订阅的课程信息调用云函数 [代码]subscribe[代码] 存入云开发数据库，云函数 [代码]subscribe[代码] 的实现在下文会讲。 index.js [代码]onSubscribe: function(e) {    // 获取课程信息    const item = e.currentTarget.dataset.item;    // 调用微信 API 申请发送订阅消息    wx.requestSubscribeMessage({      // 传入订阅消息的模板id，模板 id 可在小程序管理后台申请      tmplIds: [lessonTmplId],      success(res) {        // 申请订阅成功        if (res.errMsg === 'requestSubscribeMessage:ok') {          // 这里将订阅的课程信息调用云函数存入云开发数据          wx.cloud            .callFunction({              name: 'subscribe',              data: {                data: item,                templateId: lessonTmplId,              },            })            .then(() => {              wx.showToast({                title: '订阅成功',                icon: 'success',                duration: 2000,              });            })            .catch(() => {              wx.showToast({                title: '订阅失败',                icon: 'success',                duration: 2000,              });            });        }      },    }); [代码][代码]  },[代码] 文章字数超出 50000 字，后半部分链接 《实战分享: 小程序云开发玩转订阅消息（二）》

[图片]这是实战分享: 小程序云开发玩转订阅消息的第二部分 第一部分链接 《实战分享: 小程序云开发玩转订阅消息（一）》 将订阅消息存入云开发数据库接下来我们创建一个云函数 [代码]subscribe[代码] ，这个云函数的作用是将用户的订阅信息存入云开发数据库的集合 [代码]messages[代码] 中，等待将来需要通知用户时进行调用。 在微信开发者工具的云开发面板中创建数据库集合 [代码]messages[代码] [图片]微信开发者工具新增数据库集合 创建一个 [代码]subscribe[代码] 云函数，在云函数中我们将小程序端发送过来的课程订阅信息，存储在云开发数据库集合中，开发完成后，在微信开发者工具中右键上传并部署云函数。 cloudfunctions/subscribe/index.js [代码]const cloud = require('wx-server-sdk'); cloud.init(); const db = cloud.database(); exports.main = async (event, context) => {  try {    const {OPENID} = cloud.getWXContext();    // 在云开发数据库中存储用户订阅的课程    const result = await db.collection('messages').add({      data: {        touser: OPENID, // 订阅者的openid        page: 'index', // 订阅消息卡片点击后会打开小程序的哪个页面        data: event.data, // 订阅消息的数据        templateId: event.templateId, // 订阅消息模板ID        done: false, // 消息发送状态设置为 false      },    });    return result;  } catch (err) {    console.log(err);    return err;  } }; [代码]利用定时触发器来定期发送订阅消息接下来我们需要实现一个定时执行的云函数[代码]send[代码]，来检查数据库中是否有需要发送给用户的订阅消息。如果有需要发送的订阅消息，会通过云调用 [代码]cloud.openapi.subscribeMessage.send[代码] 将订阅消息发送给用户。 创建一个名叫 [代码]send[代码] 的云函数，首先要配置云函数，在 [代码]config.json[代码] 的 [代码]permissions[代码] 中新增 [代码]subscribeMessage.send[代码]的云调用权限，然后新增一个 [代码]sendMessagerTimer[代码] 的定时触发器，定时触发器的语法和 [代码]linux[代码] 的 [代码]crontab[代码] 类似，比如，我们配置的 [代码]"0 * * * * * *"[代码] 代表每分钟执行一次云函数。 cloudfunctions/send/config.json [代码]{  "permissions": {    "openapi": ["subscribeMessage.send"]  },  "triggers": [    {      "name": "sendMessagerTimer",      "type": "timer",      "config": "0 * * * * * *"    }  ] } [代码]接下来是实现发送订阅消息的云函数，这个云函数会从云开发数据库集合[代码]messages[代码]中查询等待发送的消息列表，检查数据库中是否有需要发送给用户的订阅消息，发送条件可以根据自己的业务实现，比如开课提醒可以根据课程开课日期来检查是否需要发送订阅消息，在我们下面的代码示例里做了简化，筛选条件只检查了状态为未发送。 查询到待发送的消息列表之后，我们会循环消息列表，依次发送每条订阅消息，发送成功后将数据库中消息的状态改为已发送。 cloudfunctions/send/index.js [代码]const cloud = require('wx-server-sdk'); exports.main = async (event, context) => {  cloud.init();  const db = cloud.database();  try {    // 从云开发数据库中查询等待发送的消息列表    const messages = await db      .collection('messages')      // 查询条件这里做了简化，只查找了状态为未发送的消息      // 在真正的生产环境，可以根据开课日期等条件筛选应该发送哪些消息      .where({        done: false,      })      .get();    // 循环消息列表    const sendPromises = messages.data.map(async message => {      try {        // 发送订阅消息        await cloud.openapi.subscribeMessage.send({          touser: message.touser,          page: message.page,          data: message.data,          templateId: message.templateId,        });        // 发送成功后将消息的状态改为已发送        return db          .collection('messages')          .doc(message._id)          .update({            data: {              done: true,            },          });      } catch (e) {        return e;      }    });    return Promise.all(sendPromises);  } catch (err) {    console.log(err);    return err;  } }; [代码]最终效果 [图片]开课提醒订阅消息截图 源代码https://github.com/binggg/tcb-subscribe-demo[3] 参考资料 [1]注册小程序帐号: https://tencentcloudbase.github.io/2019-09-03-wx-dev-guide-register/ [2]开通云开发服务: https://tencentcloudbase.github.io/2019-09-03-wx-dev-guide-service/ [3]https://github.com/binggg/tcb-subscribe-demo: https://github.com/binggg/tcb-subscribe-demo

仅一个页面完成的垃圾分类小程序代码，支持切换搜索、智能识别、离线查询。有工具类小程序的小伙伴们，可以免费快速集成为子功能模块 保护环境，人人有责，工具有责！ git代码 https://github.com/magic3lon/garbage_collection 集成体验 [图片] [图片]