【第三方登录】微信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、进入到超凡辅助软件是否有挂之后...
专业一下!随意玩有没有辅助,全... 专业一下!随意玩有没有辅助,全民比鸡bug,切实是有挂(哔哩哔哩)在进入随意玩有没有辅助软件靠谱后,...
了解一下!打哈儿辅助软件,方片... 了解一下!打哈儿辅助软件,方片十三张脚本,原来是有挂(哔哩哔哩)1、超多福利:超高返利,海量正版游戏...
教你一下!决战卡五星辅助ios... 教你一下!决战卡五星辅助ios,微乐家乡自建房辅助app,一直真的是有挂(哔哩哔哩)微乐家乡自建房辅...
辅助一下!微乐降序自建房辅助a... 辅助一下!微乐降序自建房辅助app,战神辅助官网,真是真的有挂(哔哩哔哩)1、进入到微乐降序自建房辅...
详细一下!微乐辅助靠谱麻,新5... 详细一下!微乐辅助靠谱麻,新518互游脚本下载,真是真的是有挂(哔哩哔哩)1、玩家可以在新518互游...
了解一下!广西优乐免费辅助,途... 了解一下!广西优乐免费辅助,途游辅助软件网站,一直是有挂(哔哩哔哩)1.途游辅助软件网站 选牌创建新...
辅助一下!创思维激k辅助器免费... 辅助一下!创思维激k辅助器免费,玖天乐游辅助,本来有挂(哔哩哔哩)1、上手简单,内置详细流程视频教学...
必备一下!四川游戏家园通用辅助... 必备一下!四川游戏家园通用辅助,葫芦娃七子降妖破解版,确实存在有挂(哔哩哔哩)1、玩家可以在四川游戏...