Accounts 服务

微信登录配置

在 @downcity/services 的 accounts service 里启用微信开放平台网站应用登录。

这页讲的是“微信开放平台 -> 网站应用 -> 微信登录”这条链路。

它不是公众号登录,也不是小程序登录。

这条链路的主形态是 PC 端二维码登录。

不过按微信当前官方说明,在较新的 Windows / Mac 微信客户端里,如果用户电脑上已经登录了微信,也可能直接出现快速登录确认,而不是每次都扫码。

先准备什么

在接入前,你需要先有:

  • 微信开放平台开发者账号
  • 一个已审核通过的网站应用
  • 该网站应用已开通并审核通过微信登录能力
  • 该网站应用对应的 AppIDAppSecret

如果这些前置条件还没准备好,代码里即使加了 wechat provider,也无法真正完成登录。

在 Downcity 里配什么

accounts service 读取下面两个环境变量:

  • WECHAT_CLIENT_ID
  • WECHAT_CLIENT_SECRET

也就是把微信开放平台网站应用里的:

  • AppID -> WECHAT_CLIENT_ID
  • AppSecret -> WECHAT_CLIENT_SECRET

写进 City 运行环境。

回调地址怎么填

accounts service 的 OAuth 回调地址固定是:

https://你的-base-域名/v1/accounts/oauth/callback

例如:

https://downcity.example.com/v1/accounts/oauth/callback

微信开放平台网站应用后台里登记的回调地址,必须和这里完全一致。

如果你使用的是自定义域名,就填自定义域名下的同一路径。

为什么域名经常出错

微信网站应用登录发起时,accounts service 会生成:

https://open.weixin.qq.com/connect/qrconnect

并带上当前 City 的 redirect_uri

如果微信后台配置的回调域名和你当前真实对外访问的 City 域名不一致,用户在登录时通常会直接失败。

所以这里要保证两件事同时成立:

  • 产品真正访问的 City 公网域名是对的
  • 微信后台登记的回调地址和这个域名完全一致

前端怎么接

前端不要把微信登录按钮写死,先读服务端真实开放的 provider:

const providers = await guest.service("accounts").get("providers");

如果返回里有:

{ id: "wechat", type: "oauth", enabled: true }

再展示“微信登录”入口。

发起登录时:

const start = await guest.service("accounts").action("oauth/start").invoke({
  provider: "wechat",
  town_id: "town_demo",
});

然后把用户带到返回的 start.url,再通过 oauth/result 轮询或确认结果:

const result = await guest.service("accounts").get("oauth/result", {
  state: start.state,
});

这条链路最终会返回什么

当微信登录完成后,accounts service 仍然会按统一方式返回 City user_token

也就是说,产品侧不需要因为换成微信登录,就改掉后面的用户态调用方式:

const user = new City({
  role: "user",
  city_url: "https://base.example.com",
  town_id: "town_demo",
  user_token: result.user_token,
});

常见误区

  • 把网站应用登录和公众号登录混在一起
  • 把网站应用登录和小程序登录混在一起
  • 微信后台配置了别的域名,但产品实际访问的是另一个 City 域名
  • 前端把 wechat 按钮写死,没有先读 providers

相关文档

  • 想看 OAuth 整体链路,继续读 OAuth 与 Session
  • 想看完整接入流程,读 Accounts 服务
  • 部署后记得通过 Town CLI / Admin API 把 WECHAT_CLIENT_IDWECHAT_CLIENT_SECRET 写进 City env