在公众号中使用云开发

微信云开发已支持在Web 网页中使用环境共享，即一个小程序的云开发资源可以授权共享给同主体下多个公众号（或公众号授权的web网页）使用。

同一主体下的某个已开通云开发的小程序授权共享环境给该公众号后，在该公众号网页中，则可以通过云开发 Web SDK 的接口发起登录（内部会进行公众号网页授权），登录后可以在云函数中获取用户信息、及使用公众号的服务端接口。如果网页没有绑定公众号或者不需要微信登录态，也可以直接使用 Web 未登录模式访问云开发资源。

注意：Web SDK 使用公众号登录态，需要使用静态网站托管绑定的默认域名或自定义域名（因自 iOS 14 起封禁第三方 cookie，在 Web SDK 中使用静态托管域名私有链路访问微信服务来保障安全及使用第一方 cookie），参考 第三方 Cookie 限制说明

在微信客户端内打开的 Web 网页可以进行公众号网页授权并且有登录态的安全访问云开发资源。有以下步骤：

1. 需要一个有网页授权权限的公众号 A、及一个同主体的已开通云开发的小程序 B
2. 小程序 B 在云开发控制台中通过 “环境共享” 能力，将一个或多个环境授权共享给公众号 A 使用
3. 公众号 A 的网页在微信客户端内使用云开发 Web SDK 登录，即可正常访问小程序 A 已授权共享的云开发环境资源

整个流程涉及的接口少且简单易用，详细介绍如下：

步骤一：准备公众号与小程序

公众号准备：

1. 公众号需有使用网页授权的权限
2. 配置好网页授权的回调域名
3. 配置好 JS 安全域名

小程序准备：

1. 开通云开发
2. 前往云开发控制台-更多-环境共享，开通环境共享

步骤二：小程序将环境共享给公众号使用

如果公众号 A 和小程序 B 同主体，则小程序 B 可以在 1.03.2009140 或以上版本的开发者工具云开发控制台的 “环境共享” 中，将其一个或多个环境的全部或部分资源能力授权给公众号使用。授权完成后，公众号网页可以访问小程序 B 的云开发资源的已授权部分。

步骤三：网页登录

在公众号网页中，可以使用云开发 Web SDK 同时完成公众号网页授权和云开发登录。使用 Web SDK 完成登录流程也非常简单，必要的仅有 checkLogin 和 startLogin 这两个 API。必要的登录流程如下：

1. 云开发登录：调用 checkLogin 检查网页云开发登录状态，如果未登录则调用 startLogin 发起调用，发起完成后重复该步骤；如果已登录则进行下一步
2. 获取对应小程序的访问授权：在代码中使用一个小程序的一个环境的资源时，需初始化并获取对方的授权，示例代码如下：

// 初始化一个实例，声明要使用哪个小程序哪个云环境的资源
const c = new cloud.Cloud({
  appid: '公众号 AppID',
  resourceAppid: '资源方小程序 AppID',
  resourceEnv: '资源方小程序云环境 ID',
})

// 初始化，等待授权关系校验通过以及目标云环境的 cloudbase_auth 函数返回授权
await c.init()

资源方 cloudbase_auth 函数简易返回示例：

const cloud = require('wx-server-sdk')
cloud.init({
  env: cloud.DYNAMIC_CURRENT_ENV
})

// 云函数入口函数
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()

  console.log(event)
  console.log(wxContext)
  // 跨账号调用时，由此拿到来源方小程序/公众号 AppID
  console.log(wxContext.FROM_APPID)
  // 跨账号调用时，由此拿到来源方小程序/公众号的用户 OpenID
  console.log(wxContext.FROM_OPENID)
  // 跨账号调用、且满足 unionid 获取条件时，由此拿到同主体下的用户 UnionID
  console.log(wxContext.FROM_UNIONID)

  return {
    errCode: 0,
    errMsg: '',
    auth: JSON.stringify({
      // 自定义安全规则
      // 在前端访问资源方数据库、云函数等资源时，资源方可以通过
      // 安全规则的 `auth.custom` 字段获取此对象的内容做校验，
      // 像这个示例就是资源方可以在安全规则中通过 `auth.custom.x` 获取
      x: 1,
    }),
  }
}