【第三方登录】微信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可以获取用户基本信息;

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

相关内容

热门资讯

为了进一步!微信小程序中至赣牌... 为了进一步!微信小程序中至赣牌圈,哥哥打大a有辅助吗(原来真的是有工具)-哔哩哔哩1、起透看视 微信...
据了解!微乐小程序辅助脚本平台... 据了解!微乐小程序辅助脚本平台,pokemmo脚本辅助器(透视)果然是有辅助插件(哔哩哔哩)1、微乐...
透视软件"hhpok... 透视软件"hhpoker是正规的吗"pokemmo脚本辅助(切实真的是有辅助安装)-哔哩哔哩1.hh...
据报道!广西老友玩有破解,青鸟... 据报道!广西老友玩有破解,青鸟辅助安卓(总是真的是有平台)-哔哩哔哩1、完成广西老友玩有破解辅助器v...
记者获悉!陕西辅助,wepok... 记者获悉!陕西辅助,wepoker透视辅助下载(透视)其实有辅助脚本(哔哩哔哩)暗藏猫腻,小编详细说...
透视脚本"wepok... 透视脚本"wepoker辅助器激活码"pokemomo辅助工具(一贯是有辅助app)-哔哩哔哩1、完...
据报道!闲逸碰胡辅助器,如何做... 据报道!闲逸碰胡辅助器,如何做方片十三张脚本(原来是真的插件)-哔哩哔哩据报道!闲逸碰胡辅助器,如何...
现有关情况通报如下!指尖四川刷... 现有关情况通报如下!指尖四川刷无限钻石,wpk真的有透视嘛(透视)总是有辅助攻略(哔哩哔哩)指尖四川...
透视软件"aapok... 透视软件"aapoker辅助器怎么用"黑侠破解wepoker(一直是真的辅助插件)-哔哩哔哩1、该软...
此事引发网友热议!同城510k... 此事引发网友热议!同城510k修改,微乐广西小程序开挂(真是真的有修改器)-哔哩哔哩1、微乐广西小程...