我在开发自己小程序的时候，一直觉得，如果后台管理页面也做在小程序内，未免也太密集太复杂了，其次数据展示与操作没有在WEB端来得那么清晰。
如果能使用WEB端做小程序后台，不论是交互还是体验，都能更上一层楼。
所以今天要解决的，是如何从小程序云开发调用云数据库的数据，加载到WEB页面，更进阶一点，如何操作数据库增删查改。
一、微信小程序 Web SDK
Web SDK 在 Web 中使用，可以访问云开发资源，既支持公众号登录态、也支持未登录模式。
详细官方文档：微信开发文档 SDK
未登录模式使用注意事项
- 出于安全考虑，云环境默认不支持未登录下访问，需首先在 ”云开发控制台 - 设置 - 全局设置/权限设置“ 中开启（需开发者工具 1.03.2006042 或以上）
- 未登录模式必须搭配安全规则使用，若数据库、存储的权限设置为简易权限配置而不是安全规则配置，未登录用户将无法访问云资源
- 在未登录模式访问时，安全规则的 auth 变量将为空，可以以此判断未登录请求
二、完整实践操作流程
下面我以我在自己项目开发时写的代码做示例：
1. 开启云数据库的访问权限
微信开发者工具->云开发控制台->设置->权限设置
2. 编写云函数
云函数作为中间层，连接着web与云数据库的通信，我们调用云函数返回数据。
先确保你在云数据库有一个需要获取数据的表，例如 orders 集合
创建一个云函数，例如名为 getListYes，环境ID改为你自己的。
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init({
//环境 ID
env:"cloud1-123123123123test"
})
// 云函数入口函数
exports.main = async (event, context) => {
//orders是我要取出的表名字
return cloud.database().collection('orders').get({
success(res){
return res //查询成功返回数据
},
fail(err){
return err
}
})
}3. 在web页面引入SDK必须引入此库，否则无法与云开发通信！
<script src="https://web-9gikcbug35bad3a8-1304825656.tcloudbaseapp.com/sdk/1.3.0/cloud.js"></script> 4. web页面js
注意AppID和环境ID都要填，填自己的。
// 声明新的 cloud 实例
var c1 = new cloud.Cloud({
// 必填，表示是未登录模式
identityless: true,
// 资源方 AppID 填自己的
resourceAppid: 'wx09c28499e16d592e',
// 资源方环境 ID 填自己的
resourceEnv: 'cloud1-123123123123test',
})
//初始化
c1.init()
//初始化执行完再调用
setTimeout(() => {
// 完成后正常使用资源方的已授权的云资源
c1.callFunction({
name: 'getListYes', //调用的云函数名字
success(res){
console.log(res)
}
})
}, 1000);刷新页面，在控制台就能看到返回的数据了。
由于这里使用 setTimeout ，返回数据会有延迟。
三、如何操作数据库增删查改？
同上，如法炮制在小程序里写相关操作的云函数，然后调用此云函数即可，记得返回状态是否成功。不会可以百度或AI。
CDN 地址列表（建议选最新的）：