一、参考微信公众号开发文档 网页授权 | 微信开放文档
大概可参考案例微信公众平台-测试号网页授权-获取openid方法_微信开放平台测试号-CSDN博客
二、微信公众号端开发
第一步：用户同意授权，获取code
在确保微信公众账号拥有授权作用域（scope参数）的权限的前提下（已认证服务号，默认拥有scope参数中的snsapi_base和snsapi_userinfo 权限），引导关注者打开如下页面：
scope为snsapi_userinfo：
https://open.weixin.qq.com/connect/oauth2/authorize?appid=微信测试号APPID&redirect_uri=外网可访问的自建项目接口&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirectscope为snsapi_base：
https://open.weixin.qq.com/connect/oauth2/authorize?appid=微信测试号APPID\&redirect_uri=外网可访问的自建项目接口\&response_type=code\&scope=snsapi_base\&state=123#wechat_redirect
第二步：通过code换取网页授权access_token
首先请注意，这里通过code换取的是一个特殊的网页授权access_token,与基础支持中的access_token（该access_token用于调用其他接口）不同。公众号可通过下述接口来获取网页授权access_token。如果网页授权的作用域为snsapi_base，则本步骤中获取到网页授权access_token的同时，也获取到了openid，snsapi_base式的网页授权流程即到此为止。
尤其注意：由于公众号的secret和获取到的access_token安全级别都非常高，必须只保存在服务器，不允许传给客户端。后续刷新access_token、通过access_token获取用户信息等步骤，也必须从服务器发起。
获取code后，请求以下链接获取access_token：
https://api.weixin.qq.com/sns/oauth2/access_token?appid=微信测试号APPID\&secret=微信测试号SECRET\&code=第一步链接获取到的code值\&grant_type=authorization_code
第二步：正确时返回的JSON数据包如下：
{
"access_token":"ACCESS_TOKEN",
"expires_in":7200,
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",
"scope":"SCOPE",
"is_snapshotuser": 1,
"unionid": "UNIONID"
}第三步：刷新access_token，此部分每次扫码都进行获取所以不需要，如果觉得麻烦也可以将access_token放入redis缓存定义过期时间内进行获取。
第四步：拉取用户信息(需scope为 snsapi_userinfo)
如果网页授权作用域为snsapi_userinfo，则此时开发者可以通过access_token和openid拉取用户信息了。
请求方法
第四步：正确时返回的JSON数据包如下：
{
"openid": "OPENID",
"nickname": NICKNAME,
"sex": 1,
"province":"PROVINCE",
"city":"CITY",
"country":"COUNTRY",
"headimgurl":"https://thirdwx.qlogo.cn/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/46",
"privilege":[ "PRIVILEGE1" "PRIVILEGE2" ],
"unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"
}三、自建项目：前端二维码生成，后端接口进行登录验证授权