微信公众号03 微信网页授权
前提准备
域名
开发微信网页授权时需要一个外网可以访问的域名,因为用户确认进行微信网页授权后微信服务器会通过一个回调URL向开发服务器发送一个回调请求。
开发阶段可以使用一些内网穿透工具来实现,例如:natapp、花生壳等等。
福利:natapp和花生壳都会免费赠送一些隧道。
注意:natapp提供的免费隧道每次启动客户端时产生的域名时随机的。
填坑:利用花生壳提供的域名进行内网穿透时可能会被微信拦截,所以推荐使用natapp(PS: 请测有效)。
个人订阅号
由于是进行微信网页授权,所以需要一个个人微信订阅号作为开发基础。
福利:由于微信个人订阅号没有提供微信网页授权功能,但是可以利用微信提供的测试号进行开发。
测试号在哪里:登录个人订阅号 -> 开发 -> 开发者工具 -> 公众平台测试账号
注意:整个开发过程中都是使用测试号的appID和appsecret
开发环境
JDK: 1.8
MAVEN: 3.x
SpringBoot: 2.x
IDEA: 2017专业版
微信网页授权官方文档
文档路径
文档在哪里:登录微信订阅号 -> 开发 -> 开发者工具 -> 开发文档 -> 微信网页开发 -> 微信网页授权
回调域名配置
在哪里配置:登录个人订阅号 -> 开发 -> 开发者工具 -> 公众平台测试账号 -> 网页服务 -> 网页账号 -> 修改 -> 填入授权回调页面域名即可(推荐使用natapp)
开发步骤
1 第一步:用户同意授权,获取code
2 第二步:通过code换取网页授权access_token
3 第三步:刷新access_token(如果需要)
4 第四步:拉取用户信息(需scope为 snsapi_userinfo)
5 附:检验授权凭证(access_token)是否有效
Java代码实现
进入微信授权页面
只需要通过微信浏览器访问到微信授权的页面即可。
思路
01 用户通过微信浏览器进入一个页面
02 点击一个按钮向开发者后台发送一个GET请求
03 开发这个后台封装一个URL并重定向到这个URL
代码片段
/** * 微信网页授权逻辑入口 * @param map */ @GetMapping(value = "/auth") public void toAuth(ModelMap map, HttpServletRequest request, HttpServletResponse response) throws IOException { log.info("进入微信授权逻辑......"); // 微信网页授权第一步 - 用户同意授权,获取code - start String getCodeUrl = weixinBaseInfoProperties.getAuth().getGetCodeUrl(); String appid = weixinBaseInfoProperties.getAppid(); String appsecret = weixinBaseInfoProperties.getAppsecret(); String redirectUri = weixinBaseInfoProperties.getAuth().getRedirectUri(); String scope = weixinBaseInfoProperties.getAuth().getScope(); getCodeUrl = getCodeUrl.replace("APPID", appid) .replace("REDIRECT_URI", redirectUri) .replace("SCOPE", scope); log.info("封装好的getCodeUrl为:" + getCodeUrl); response.sendRedirect(getCodeUrl); // 微信网页授权第一步 - 用户同意授权,获取code - end }
获取CODE和AccessToken、用户openid、用户信息
微信用户通过微信浏览器确认授权后,微信服务器会通过之前设定的回调URL向开发者后台发送一个GET请求,这个请求中携带了CODE信息。
思路
01 用户确认授权
02 微信服务器发送回调请求
03 开发服务器接收到回调请求
04 获取CODE
05 通过CODE在拼装一个url去请求微信服务器来获取access_token、openid
06 通过access_token、openid封装一个url去请求微信服务器来获取用户信息
微信网页授权的使用场景
直接利用微信账号作为网页账号
获取用户信息成功后直接跳转到目标页面即可
微信账号和网站账号进行绑定
思路:
01 获取用户信息成功
02 根据用户openid到数据库中去查找网页账号信息
03 如果查找到信息就说明已经绑定,直接跳转拿到目标页面即可
04 如果没有获取到就跳转到登录绑定页面
05 用户输入账号和密码并提交到开发者后台
06 后台需对网站账号合法性进行校验
07 校验通过后进行绑定操作
08 跳转到目标页面
代码片段一
/** * 回调页面 * @param map * @return */ @GetMapping(value = "/callback") public String callback(ModelMap map, HttpServletRequest request, HttpServletResponse response) { log.info("进入回调处理逻辑......"); String appid = weixinBaseInfoProperties.getAppid(); String appsecret = weixinBaseInfoProperties.getAppsecret(); // 微信网页授权第二步 - 通过code换取网页授权access_token - start StringBuffer requestURL = request.getRequestURL(); log.info("进入回调处理逻辑的请求url为:" + requestURL); String code = request.getParameter("code"); log.info("获取到的用于换取access_token的票据的code值为:" + code); String getAccessTokenUrl = weixinBaseInfoProperties.getAuth().getGetAccessTokenUrl(); getAccessTokenUrl = getAccessTokenUrl.replace("APPID", appid) .replace("SECRET", appsecret) .replace("CODE", code); log.info("封装好的用于获取accessToke的url为:" + getAccessTokenUrl); String getAccessTokenResponseStr = httpUtils.doGetStrByRestTemplate(getAccessTokenUrl); log.info("发送获取access_token请求后的响应为STR:" + getAccessTokenResponseStr); GetAuthAccessTokenResponse getAuthAccessTokenResponse = transformerUtils.String2Object(getAccessTokenResponseStr, GetAuthAccessTokenResponse.class); log.info("发送获取access_token请求后的响应为:" + getAuthAccessTokenResponse); String access_token = getAuthAccessTokenResponse.getAccess_token(); String open_id = getAuthAccessTokenResponse.getOpenid(); // 微信网页授权第二步 - 通过code换取网页授权access_token - end // 微信网页授权第四步 - 拉取用户信息(需scope为 snsapi_userinfo) - start String getUserInfoUrl = weixinBaseInfoProperties.getAuth().getGetUserInfoUrl(); getUserInfoUrl = getUserInfoUrl.replace("ACCESS_TOKEN", access_token) .replace("OPENID", open_id); log.info("封装好的用于获取userInfo的url为:" + getUserInfoUrl); String getUserInfoResponseStr = httpUtils.doGetStrByRestTemplate(getUserInfoUrl); log.info("发送获取userInfo请求后的响应为STR:" + getUserInfoResponseStr); GetUserInfoResponse getUserInfoResponse = transformerUtils.String2Object(getUserInfoResponseStr, GetUserInfoResponse.class); log.info("发送获取userInfo请求后的响应为:" + getUserInfoResponse); // 微信网页授权第四步 - 拉取用户信息(需scope为 snsapi_userinfo) - end // 第一种使用:直接使用微信的用户用户体系 // map.addAttribute("userinfo", getUserInfoResponse); // return "index2"; // 第二种:微信用户和网站用户进行绑定 // 根据openid查询网站的账户信息 UserBindDO userBindDOByOpenid = userBindRepository.findByOpenid(getUserInfoResponse.getOpenid()); if (userBindDOByOpenid != null) { // 已经绑定过的情况 log.info("已经绑定过啦"); map.addAttribute("userinfo", userBindDOByOpenid); return "index3"; } else { // 没有绑定过的情况 log.info("还未进行绑定操作"); map.addAttribute("openid", getUserInfoResponse.getOpenid()); map.addAttribute("nickname", getUserInfoResponse.getNickname()); return "login"; } }
代码片段二
@PostMapping(value = "/login") public String login(UserBindDO userBindDO, ModelMap map) { log.info("获取到的参数信息为:" + userBindDO); // TODO: 对账户信息进行格式校验,如果格式不正确直接返回登录绑定页面 // TODO: 验证账户是否存在, 如果不存在直接跳转到注册页面(微信用户信息同时返回),在注册逻辑中直接进行绑定 // TODO: 验证账户密码是否正确,如果部正确直接返回登录绑定页面 UserBindDO save = userBindRepository.save(userBindDO); if (save != null) { log.info("bind - 绑定成功"); log.info("绑定后的结果信息为:" + save); map.addAttribute("userinfo", save); return "index3"; } else { log.info("bind - 绑定失败"); return "login"; } }
源代码
扫码获取