【第三方登录】微信web扫一扫登录步骤
创始人
2025-01-16 17:05:31
0

目录

  • 目的
  • 特别说明
  • 要求
  • 前端
  • 后端
  • 总结

目的

实现用微信扫一扫,登录网站
微信官网文档:微信接口文档

特别说明

截止与2023年10月26日前,微信登录需要在 “微信开发平台” 绑定第三方应用或网站,然而,注册、认证、绑定网站走完才能用这个微信扫码登录功能,注意:需要一次性交300元的认证费。一般来说只有企业才做这样的事情,如果是个人建议看看就行。
步骤如下图所示:

要求

注册一个“微信开发平台”账号、认证账号、绑定一个网站。(三个要求)
如下所示:
在这里插入图片描述

打开如下:注意这个回调域名,要和前端vue上的一致
在这里插入图片描述

前端

在vue的index.html文件中添加

                    

登录页面,记得redirect_uri要与上面微信开放平台的域名一致

// Login.vue     

页面会出现一个二维码
在这里插入图片描述

后端

    @GetMapping("/getUnionid")     public AjaxResult getUnionid(@RequestParam("code") String code) {         String ParamAppid = "appid=" + wxProperties.getAppid();         String ParamSecret = "secret=" + wxProperties.getSecret();         // 用户授权码         String ParamCode = "code=" + code;         String url = "https://api.weixin.qq.com/sns/oauth2/access_token?grant_type=authorization_code&" + ParamAppid + "&" + ParamSecret + "&" + ParamCode;         String forObject = restTemplate.getForObject(url, String.class);         JSONObject jsonObject = JSONObject.parseObject(forObject);          if (jsonObject != null) {             try {                 String access_token = jsonObject.get("access_token").toString();                 String openid = jsonObject.get("openid").toString();                 WXUserInfo wxUserInfo = getWXUserInfo(access_token,openid);                 HashMap hashMap = new HashMap<>();                 hashMap.put("wxUserInfo", wxUserInfo);                 return AjaxResult.success("操作成功", hashMap);             } catch (Exception e) {                 return AjaxResult.error();             }         }         return AjaxResult.error();     }      /**      * 获取微信用户详情信息      * @param access_token  用户凭证      * @param openid        用户id      * @return              微信用户实体类      */     private WXUserInfo getWXUserInfo(String access_token,String openid) {         WXUserInfo wxUserInfo = new WXUserInfo();          String wx_url = "https://api.weixin.qq.com/sns/userinfo?lang=zh_CN&access_token=" + access_token + "&openid=" + openid;         String ob = restTemplate.getForObject(wx_url, String.class);          JSONObject job = JSONObject.parseObject(ob);         // 封装实体类         if (job != null) {             wxUserInfo.setOpenid(job.get("openid").toString());             wxUserInfo.setNickname(job.get("nickname").toString());             wxUserInfo.setSex(job.get("sex").toString());             wxUserInfo.setLanguage(job.get("language").toString());             wxUserInfo.setCity(job.get("city").toString());             wxUserInfo.setPrivilege(job.get("province").toString());             wxUserInfo.setCountry(job.get("country").toString());             wxUserInfo.setHeadimgurl(job.get("headimgurl").toString());             wxUserInfo.setPrivilege(job.get("privilege").toString());             wxUserInfo.setUnionid(job.get("unionid").toString());         }         return wxUserInfo;     } 

总结

第一步,用户同意微信登录后,获取code
第二步,拿着code可以获取openid、unionid、access_token
第三步,拿着openid和access_token可以获取用户基本信息;

后端能拿到个人信息,其实就已经完成了,接下来就看具体的个人业务需求了。祝君工作顺利!

相关内容

热门资讯

一分钟了解!德普之星辅助挂多功... 一分钟了解!德普之星辅助挂多功能透视工具,原来真的有挂(有挂头条)1、完成德普之星有辅助插件,帮助玩...
第三方辅助挂!甘孜大厅辅助透视... 第三方辅助挂!甘孜大厅辅助透视挂,闲来棋牌合集真的有挂,其实证实有挂1.甘孜大厅 选牌创建新账号,点...
查到实测!德扑之星辅助挂多功能... 查到实测!德扑之星辅助挂多功能透视工具,切实真的是有挂(有挂秘籍)1、该软件可以轻松地帮助玩家将德扑...
为了进一步!佳友互娱辅助透视挂... 为了进一步!佳友互娱辅助透视挂,旺旺福建麻将确实有挂,都是详细教程进入游戏-大厅左侧-新手福利-激活...
玩家必备科普!德扑之星辅助挂多... 玩家必备科普!德扑之星辅助挂多功能透视工具,一贯是真的有挂(存在有挂)德扑之星能透视中分为三种模型:...
据统计!白金岛十胡卡辅助透视挂... 据统计!白金岛十胡卡辅助透视挂,河北竞技存在有挂,原来有挂攻略1、完成白金岛十胡卡有辅助插件,帮助玩...
分享一款!aapoker辅助挂... 分享一款!aapoker辅助挂多功能透视工具,真是有挂(真的有挂)1、下载好aapoker正确养号方...
今年以来!口袋娱乐辅助透视挂,... 今年以来!口袋娱乐辅助透视挂,湛江千分是真的有挂,一直新版有挂1、进入到口袋娱乐是否有挂之后,能看到...
揭秘真相!德扑之星辅助挂多功能... 揭秘真相!德扑之星辅助挂多功能透视工具,都是存在有挂(有挂教程)所有人都在同一条线上,像星星一样排成...
黑科技教程!湖北家乡麻将辅助透... 黑科技教程!湖北家乡麻将辅助透视挂,闲娱江西棋牌是有挂,确实有挂分析1、起透看视 闲娱江西棋牌辅助软...