Vue + Java 实现扫码登录到公众号推送消息思路

前言

• 需要在PC端生成二维码，用户扫码进到公众号关注，推送消息，用户扫码一次即可

• 对于前端而言在PC端调用api获取到http路径二维码图片，通过img标签渲染，手机扫码即可

• 对于后端而言可能操作比较麻烦，需要经过一些列操作，获取，解析，取数据，存储绑定

具体实现

1.前端调用api获取二维码路劲渲染出来，该用户扫码

2.获取公众号access_token-是公众号的全局唯一接口调用凭据-公众号文档搜索-获取access_token

3.后端通过公众号提供接口生成配合临时二维码-公众号文档搜索-生成带参数二维码

• 通过PC端用户信息id配合公众号提供api生成带参数临时二维码供用户扫码

• 因为这个二维码是公众号api+access_token生成的，二维码只会跳转到我们申请公众号

• 如果第一次扫码未关注，会来到关注页面，已关注直接进入到公众号里面

4.通过二维码扫码事件它会向后端发送XML数据包-公众号文档搜索-生成带参数二维码-接收事件推送

• url配置-公众号后台-设置与开发-基本配置-服务器配置

• 这个数据包发送是需要指向一个地址发送XML数据包的，在测试号时候可以直接填写服务器地址

• 这个url指向错误时扫二维码关注公众号可能会出现一行字-故障，请重新扫码

• 当用户扫描二维码触发关注公众号时，公众号会向指定URL服务推送XML数据包

• 这个时候我们可以获取到该用户在当前公众号的openid

• 还有生成临时二维码的参数-用户id

• 我们可以在数据库把用户id和openid关联起来，实现扫码关注一次以后一直可以推送消息

5.openid相当于是这个用户在这个公众号的身份，是不会变得-公众号文档搜索-生成带参数二维码-接收事件推送-用户管理-获取用户基本信息(UnionID机制)

6.公众号消息推送-公众号文档搜索-模板消息接口-发送模板消息

• 在公众号后台-广告与服务-模板消息-申请推送模板会有模板id

• 模板id决定推送消息到公众号时是什么样形式布局

• access_token决定发送到哪一个公众号

• openid决定推送到公众号是哪一个关注公众号用户可以看见（每个用户openid是不一样的）

• 如果关联小程序可以直接配置路劲和参数点击推送消息跳转到关联的上线小程序中的页面

---

总结：

经过这一趟流程下来相信你也对 Vue + Java 实现扫码登录到公众号推送消息思路 有了初步的深刻印象，但在实际开发中我 们遇到的情况肯定是不一样的，所以我们要理解它的原理，万变不离其宗。加油，打工人！

什么不足的地方请大家指出谢谢 -- 風过无痕