一、微信公众号 （一）基础信息 微信授权类型
自己的网站、APP等第三方，要实现接入微信授权登录，有多种方式：微信公众号（网页）、微信小程序、微信开放平台（APP）等等。
【项目代码】
GitHub - liyinchigithub/springboot-learn: springboot 学习项目
微信公众号（网页） 1.申请公众号 （1）第一步 认证微信公众帐号
首先，得拥有一个通过认证了的微信公众号或者开发者帐号认证费一年300块钱；
（2）第二步 添加安全域名
在公众帐号平台后台添加 app 运行的域名地址，为某个域名添加白名单功能，让微信知道这个ip是你的机子。
例如：微信公众号是”瓜瓜“，添加了 guagua.com 为安全域名，那么我在 guagua.com 上的网页可以使用瓜瓜下公众帐号的数字签名了；
（3）第三步 生成数字签名
在微信公众平台后台上面能找到一个 appid 及 secret字符串
通过这两个参数，请求微信提供的两个公开API地址，生成对应的access_token后再生成ticket再通过规则加密成数字签名，数字签名必须在服务端生成，这里我以Springboot来实现
2.微信公众号平台配置
微信公众平台微信公众平台，给个人、企业和组织提供业务服务与用户管理能力的全新服务平台。
https://mp.weixin.qq.com/
（1）添加开发者的微信号到公众号人员设置中
绑定运营者微信号
（2）添加开发者微信账号到web
菜单路径：首页》开发》开发者工具》Web开发工具 》绑定开发者微信号
绑定开发者微信号
（3）查看微信公众号appID和appScrent
菜单路径：首页》开发》基本配置 》公众号开发信息
（4）将AppID和AppSecret配置到项目中
3.微信公众平台接口调试工具（检测准备工作情况）
如果微信公众号认证还没通过，可以先使用官方提供的测试号来进行调试。
方便调试，在线工具：微信公众平台接口调试工具
注意：这边使用的appid和secret是测试号的环境（沙盒）。
微信公众平台
遇到问题：如果接口报错返回提示无效ip
解决办法：需要将本地电脑ip地址，添加到公众号ip白名单中。
菜单路径：设置与开发 > 基本配置 > IP白名单 > 查看/添加
重新请求，成功获取accessToken
【使用微信JSSDK示例】
（1）获取关注者列表接口 ① 基础支持-获取access_token接口
备注：旧版本是formdata格式（2020年），新版本是json格式（2024年6月16日）
{ "grant_type": "client_credential", "appid": "xxxxx", "secret": "xxxxxx" }② 获取关注列表接口
传入上一步access_token参数值，作为鉴权参数。
所有关注此公众号的微信号openid都在数组里
（2）获取用户基本信息接口 /user/info
①填入上一步获取到的access_token
②填入上上步获取到的openid（可通过获取关注者列表接口获取到）
最新版没有用户昵称（2024年6月16日）
遇到问题：token过期
{ "errcode": 42001, "errmsg": "access_token expired rid: 666fa0b9-04633663-35fb85fa" }“解决办法：重新调用，基础支持获取access_token获取新的token
网页授权 | 微信开放文档微信开发者平台文档
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html
前端通过用户触发请求公众号授权接口
注意：这种方式会暴露appid在前端页面
微信开发者工具，访问本地开发环境地址（模拟微信客户端内置浏览器打开业务域名，一般是登录页面）
返回数据
注意：请求`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`，不能使用客户端自带http请求库（如：axios、request）来发起请求这个地址，而是只能使用location.href方式
4.方向代理配置 第一种：本地配置Nginx代理转发（推荐）
Nginx文件
// 修改nginx.conf文件
server {
listen 80;#
监听的端口号
server_name wxh5.xxx.fssh.com;#
本地访问的域名(注意： host文件也要配置)
location / {#
前端项目接口， 反向代理路径
proxy_pass http: //127.0.0.1:9020/;
#代理的域名加本地项目启用的端口号 - > nginx服务会代理本地起的服务从而可以在wx开发者工具上调试， 因为你的目的就是为了在工具调试本地的微信授权登录的流程
}
location / sns {#
微信公众号平台接口， 反向代理路径#
return 666;
proxy_pass https: //api.weixin.qq.com;
}
location / code {#
code回调接口地址
proxy_pass http: //127.0.0.1:4343;
}
location / api {#
后端项目接口， 反向代理路径
proxy_pass http: //127.0.0.1:4343;
}
}host文件
127.0.0.1 wxh5.xxx.fssh.com教程：window安装配置nginx（window Nginx安装配置）
原本我使用花生壳做内网穿透，但百度到一篇文件，不使用花生壳，可以直接修改hosts文件+nginx配置，就可以用本地自定义的域名来通过微信开发者工具访问到前端项目、前端项目访问后端接口，具体如下。
cd /usr/local/etc/nginx open /usr/local/etc/nginx我的本地前端项目地址、端口
127.0.0.1:9020
我的本地后端项目地址、端口
127.0.0.1:4343
重启nginx
sudo nginx -s reload微信公众号js接口安全域名配置（域名与nginx配置自定义本地域名一致）
微信公众号测试号，回调域名配置（域名与nginx配置自定义本地域名一致）
微信开发者工具，访问本地前端项目，url输入自定义本地域名
开发者工具url输入，自定义本地域名+/api/
示例：后端 接口/code
对应nginx中的/code如下：
nginx.conf文件
总结，本地nginx文件配置流程：
备注：如果使用nodejs anywhere库启动打包后静态文件dist文件夹，那么IP也是127.0.0.1+anywhere端口号修改配置到nginx
5.微信JSSDK引入与配置
前端什么时候需要引入微信JS-SDK？
（1）如果你的目的是让用户点击按钮后通过重定向到微信授权页面进行登录，那么不需要引入微信JS-SDK。
这种情况下，用户的登录流程是完全由后端处理的，前端只负责触发重定向。
Wechat Login
Wechat Login Test
（2）当你需要用到用户地理位置、微信支付、分享等。
如果你需要在你的H5页面中使用这些功能，或者需要通过微信网页直接获取用户信息而不是重定向，那么你应该引入和配置JS-SDK。
引入和配置步骤
（1）引入JS-SDK:
在你的HTML页面中，添加以下脚本标签来引入微信JS-SDK。
（2）配置JS-SDK:
你需要后端提供JS-SDK的配置信息，包括appId, timestamp, nonceStr, signature等。这些信息需要通过调用微信的接口获得。
配置示例如下：
wx.config({
debug: true, // 开启调试模式
appId: '你的AppID', // 必填，公众号的唯一标识
timestamp: '生成签名的时间戳', // 必填，生成签名的时间戳
nonceStr: '生成签名的随机串', // 必填，生成签名的随机串
signature: '签名', // 必填，签名
jsApiList: ['checkJsApi', 'onMenuShareTimeline', 'onMenuShareAppMessage'] // 必填，需要使用的JS接口列表 });（3）发起微信登录请求:
如果你决定使用JS-SDK来处理登录，可以使用wx.login方法来发起微信登录请求。
wx.login({
success: function(res) {
if (res.code) {
// 使用返回的code去后端换取access_token等信息
} else {
console.log('登录失败！' + res.errMsg);
}
}
});在wechatLogin.html实现引入JSSDK并获取用户地理位置、分享。
（1）你需要从后端获取必要的配置参数（appId, timestamp, nonceStr, signature），这通常涉及到服务器端的一些处理，以确保安全性。这里假设你已经有了一个API可以调用来获取这些数据。
在HTML中添加以下脚本来配置SDK
（2）使用JS-SDK获取地理位置
在配置成功后，你可以调用wx.getLocation方法来获取用户的地理位置：
（3）处理错误
添加错误处理来响应配置失败的情况：
总结
如果你的页面只是需要一个简单的微信登录按钮，并通过后端处理登录流程，那么不需要引入微信JS-SDK。
6.UnionID 微信开放平台
（1）如果需要在多公众号、移动应用之间做用户共通，则需前往微信开放平台，将这些公众号和应用绑定到一个开放平台账号下，绑定后，一个用户虽然对多个公众号和应用有多个不同的OpenID，但他对所有这些同一开放平台账号下的公众号和应用，只有一个UnionID，可以在用户管理-获取用户基本信息（UnionID机制）文档了解详情。
7.公众号消息会话
（1）群发消息：
公众号可以以一定频次（订阅号为每天1次，服务号为每月4次），向用户群发消息，包括文字消息、图文消息、图片、视频、语音等。
（2）被动回复消息：