# 开发 \| 无需后端编码，10 分钟教你实现一个朋友圈小程序 - 作者：武国琪 - 发布时间：2017-09-29 20:00 - 原文：https://www.ifanr.com/minapp/916787 ![](https://s3.ifanr.com/wp-content/uploads/2017/07/minapp-dev-final-feature.jpg) 文 \| 梁烨鹃 这是一篇简易版朋友圈小程序的快速开发教程。要实现的功能有： - 所有人都可以发布内容。 - 只有发布者可以删除自己发布的内容。 - 所有人都可以看到其他人发布的内容。 - 所有人都可以对内容进行评论。 - 只有发布者可以可以删除评论。 - 所有人都可以看到其他人发表的评论。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL01.jpg) 虽然目标功能的业务逻辑并不复杂，**但其背后需要一套靠谱的权限控制系统**，也意味着需要一个完整的后端服务系统来支持运行。 为了免去搭建、维护后端服务器的麻烦，我们选择使用知晓云（cloud.minapp.com）进行开发。 除了因为可以省去后端服务器的开发外，另一个选择它的原因，**是它的数据表 ACL（Access control list，访问权限控制）可以实现目标功能的权限控制操作**。 我们只需要将获取到的数据正确渲染到页面，即可完成目标小程序的开发，十分方便。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACLgouzi.jpg) ### 了解 ACL 控制系统 工欲善其事，必先利其器。在开始小程序开发之前，我们先来了解一下知晓云的 ACL 控制系统。 进入知晓云控制后，点击「应用」，在「数据库」模块里，点击「创建数据库」，就能看到 ACL 控制面板。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL02.jpg) **在创建数据表时，可以设置该数据表的表录入权限，以及该表中数据行的默认权限**。若权限勾选了用户组则必须选择拥有权限的用户组。 需要注意的是，用户组需要在用户模块中提前设置好才能进行选择。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL03.jpg) 设置好了默认数据行的权限后，该表的所有数据行都继承该默认权限。**若你需要对某些记录进行权限修改，可以选择要修改的数据行，点击编辑，即可进行权限修改**。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL04.jpg) 若你需要对默认数据行权限进行修改，对数据表点击编辑即可打开权限修改面板。**修改的默认数据行权限，仅对修改后新增的数据生效**，对已存在的旧数据无效。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL05.jpg) 设置好 ACL 权限后，**只需要调用 BaaS SDK 的接口即可以方便进行数据库的操作**。 关于数据库的操作，我们之前已发布了详细的教程，这里就不再赘述。 了解的工具的使用方法之后，我们开始小程序的开发。 ### 数据表创建 首先我们为内容发表、评论发表分别创建数据库表。权限设置如下： ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL06.jpg) - 所有人都可以发表内容或者对某一条内容发表评论，所以数据表的录入权限我们设置为所有人。 - 所有人都可以看到别人发表的内容，数据行的默认权限读权限设置为所有人。 - 但是只有发布者可以删除发表的内容，数据行的默认写权限设为创建者。 - 记录评论的数据表我们也做一样的设置。 为了实现目标小程序的功能，内容表 `message` 的自定义字段有：`text`（内容）、`author`（内容发布者）、`avatar_url`（内容发布者的头像地址）；评论 `comment` 表的自定义字段有：`message_id`（内容 ID）、`author`（发布者）、`text`（评论内容）。 需要注意：**知晓云创建的数据表会默认帮你创建几个字段**，其中有一个 `created_by` 创建者，会自动帮你记录微信接口返回的用户 ID（`userInfo.id`）。 我一开始并没有留意到这个细节，在表中自己维护了一个 `wx_id` 字段，但是没有考虑好数据获取稳定性的问题，在某种情况会传入失败，还耗费了一些时间处理这个问题。最后发现这部分数据知晓云已经帮你处理好了。 ### 小程序开发 在微信开发者工具创建一个新的项目，它会默认自动帮你新建一个小程序 demo。 在 `app.js` 里已经有完整的获取用户信息的代码，可以直接用，在 `onLaunch` 中引入 BaaS SDK 即可。 在 `index.wxml` 里进行页面布局开发，**小程序的框架语法与主流的框架的语法还是基本一致的，除了提供一些基本的组件，没有太多的标签**，很容易上手。 如评论的页面结构：用 `block` 标签进行条件渲染控制，应用列表渲染进行评论内容的渲染。以 `data-` 为前缀的自定义数据可以在监听事件中以 `e.target.dataset` 获取。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL07.jpg) **由于在创建数据表时已设置好了 ACL 权限，我们只需要应用 BaaS SDK 进行数据获取、查询、删除等操作即可**，不需要对数据进行二次处理。 如在获取内容列表、评论列表数据的操作中，根据 SDK 的文档进行操作，不需要传入特定的查询条件。获取所有的内容数据、是否可以读出数据行的权限操作，都可以交给知晓云的 ACL 控制。 若数据行的 ACL 控制改为创建者可读，则除创建者外其他用户拉取到不到该条数据。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL08.jpg) 同时需要注意的是，**我们是通过获取内容数据，根据内容 ID 再去查询对应的评论数据，该过程是异步的**。 我在这里的做法是，**将获取到的内容数据传入到获取评论的方法中，待评论数据获取成功后再一并通过 `setData` 更新数据渲染**。若不是同时更新内容、评论的数据，会造成评论数据渲染失败。 新增数据、删除数据的操作根据 SDK 的文档写即可，这里不详述。 至此我们的小程序已开发完毕。效果如下： ![](https://s3.ifanr.com/wp-content/uploads/2017/09/ACL09.jpg) 点击发布消息可进行消息发布，可对别人的发布的内容进行评论。本人创建的内容、评论可以进行删除操作。完成这一个小程序，我并不需要进行后端代码的编写，也不需要对获取到的数据进行复杂的判断处理。 当然这只是一个简单例子的应用，你也可以进行更复杂的功能设计。如果你也有类似的业务需求，就赶紧来知晓云（cloud.minapp.com）试一下吧。 **关注「知晓程序」公众号 👇** - 在微信后台回复「**开发**」，开发。 - 在微信后台回复「**666**」，加入知晓开发联盟。 ![](https://s3.ifanr.com/wp-content/uploads/2017/09/minapp-qrcode.gif)