微信扫码登入

首先去通过微信开放平台做好开发者资质认证，创建网站应用然后等待审核
开发者资质认证
PC网站实现微信扫码登陆 - 图1
网站应用
PC网站实现微信扫码登陆 - 图2
审核通过的话就是这个样子 还有最底下的授权回调地址 (www.xxxxx.com) 填写域名即可
PC网站实现微信扫码登陆 - 图3

  1. <!-- WeChatQrCode -->
  2.         <dependency>
  3.             <groupId>com.github.binarywang</groupId>
  4.             <artifactId>weixin-java-mp</artifactId>
  5.             <version>3.4.0</version>
  6.         </dependency>
  7.         <dependency>
  8.             <groupId>org.junit.jupiter</groupId>
  9.             <artifactId>junit-jupiter-api</artifactId>
  10.             <version>RELEASE</version>
  11.             <scope>compile</scope>
  12.         </dependency>

第一步 用户通过点击事件获取到微信二维码连接

PC网站实现微信扫码登陆 - 图4

  1.  /**
  2.   * 获取微信登陆二维码地址
  3.   * @return
  4.   */
  5.  @RequestMapping(value = "/getQRCodeUrl",method = RequestMethod.POST)
  6.  public Message getQRCodeUrl() {
  7.   logger.info("获取二维码地址");
  8.   try {
  9.    String codeUrl = weChatService.getQRCodeUrl();
  10.    logger.info("codeUrl:"+codeUrl);
  11.    return new Message(ResponseEnum.SUCCESS,codeUrl);
  12.   }catch (Exception e){
  13.    logger.error(e.toString()+e);
  14.    return new Message(ResponseEnum.FALL);
  15.   }
  16.  }
  17.  @Override
  18.  public String getQRCodeUrl() {
  19.   // 生成 state 参数，用于防止 csrf
  20.   String date = DateUtil.format(new Date(), "yyyyMMdd");
  21.   String state = MD5Utils.generate(CSRF_KEY + date);
  22.   return wxMpService.buildQrConnectUrl(wxRedirectUrl,"snsapi_login", state);
  23.  }
  1.  /**
  2.   * 回调地址
  3.   * @param code
  4.   * @param state
  5.   * @return
  6.   */
  7.  @RequestMapping(value = "/wxCallBack",method = RequestMethod.POST)
  8.  public Message wxCallBack(HttpServletRequest request, HttpServletResponse response,
  9.    @RequestParam(name = "code",defaultValue = "") String code, @RequestParam(name = "state",defaultValue = "")String state) {
  10.   if(StringUtils.isBlank(code)){
  11.    return new Message(ResponseEnum.ESSENTIAL_IS_NULL);
  12.   }
  13.   if(StringUtils.isBlank(state)){
  14.    return new Message(ResponseEnum.ESSENTIAL_IS_NULL);
  15.   }
  16.   logger.info("微信回调------------");
  17.   logger.info(code+"------"+state);
  18.   try {
  19.    Message message=weChatService.wxCallBack(request,code, state);
  20.    return message;
  21.   }catch (Exception e){
  22.    logger.error(e.toString()+"\n"+e);
  23.    return new Message(ResponseEnum.FALL);
  24.   }
  25.  }
  26. @Override
  27.  public Message wxCallBack(HttpServletRequest request, String code, String state) {
  28.   String openId = null;
  29.   if (code != null) {
  30.    // 获取 openid
  31.    try {
  32.     WxMpOAuth3AccessToken accessToken = wxMpService.oauth3getAccessToken(code);
  33.     if (accessToken == null) {
  34.      return new Message(ResponseEnum.DATA_IS_NULL);
  35.     }
  36.     openId = accessToken.getOpenId();
  37.     log.info("openId:" + openId);
  38.     /*token = accessToken.getAccessToken();*/
  39.      WxMpUser wxUser = wxMpService.oauth3getUserInfo(accessToken, null);
  40.      log.info(wxUser.toString());
  41.          return new Message(ResponseEnum.WECHAT_NOT_BINGDING, wxUser);
  42.    } catch (WxErrorException e) {
  43.     log.error(e.getMessage(), e);
  44.     return new Message(ResponseEnum.FALL);
  45.    }
  46.   }
  47.   return new Message(ResponseEnum.FALL);
  48.  }

前端请求

  1. $("#weiLog").click(function () {
  2.   $.ajax({
  3.    type: "POST",
  4.    url: "/api/wx/getQRCodeUrl",
  5.    dataType: 'json',
  6.    success: function (result) {
  7.     //console.log(result);
  8.     if(result.code==0){
  9.      this.itop = (window.screen.availHeight - 500) / 2;
  10.      //获得窗口的水平位置
  11.      this.ileft = (window.screen.availWidth - 400) / 2;
  12.      this.w = window.open(
  13.       result.data,
  14.       "newwindow",
  15.       "height=500, width=600, top=" +
  16.       this.itop +
  17.       ", left = " +
  18.       this.ileft +
  19.       ", toolbar=no, menubar=no,scrollbars=no, resizable=no,location=no, status=no"
  20.      );
  21.     }
  22.    }
  23.   });
  24.  });

原文链接：https://www.yisu.com/zixun/195090.html