一文搞定web微信第三方登录

https://open.weixin.qq.com/connect/qrconnect?appid=wxea3axxxxx41a91a&redirect_uri=http://20y85987b7.51mypc.cn/&response_type=code&scope=snsapi_login&state=gd5q4tcr#wechat_redirect

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.3.2.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>cn.cnbuilder.wechat</groupId>
    <artifactId>pc-login</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>pc-login</name>
    <description>Demo project for Spring Boot</description>

    <properties>
        <java.version>1.8</java.version>
        <!-- lib versions -->
        <WxJava.version>3.3.5.B</WxJava.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter</artifactId>
        </dependency>

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.46</version>
        </dependency>

        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>3.0.7.1</version>
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>

        <dependency>
            <groupId>cn.hutool</groupId>
            <artifactId>hutool-all</artifactId>
            <version>4.1.21</version>
        </dependency>


        <!--添加fastjson依赖-->
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>fastjson</artifactId>
            <version>1.2.28</version>
        </dependency>


        <!--注解做映射-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>


        <dependency>
            <groupId>org.apache.commons</groupId>
            <artifactId>commons-lang3</artifactId>
            <version>3.8</version>
        </dependency>

    </dependencies>
    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>
</project>

index controller
package cn.cnbuilder.wechat.webLogin.controller;

import cn.cnbuilder.wechat.webLogin.entity.R;
import cn.cnbuilder.wechat.webLogin.service.WechatWebLoginService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpServletRequest;

/**
 * 首页
 * create on 2020/08/07 by kingyifan
 */
@RestController
public class IndexController {

    @GetMapping(value = "/")
    public String getCreatCodeUrl() {
        return "wechat之web第三方登录工程";
    }
}
WechatWebLoginController:
package cn.cnbuilder.wechat.webLogin.controller;

import cn.cnbuilder.wechat.webLogin.service.WechatWebLoginService;
import cn.cnbuilder.wechat.webLogin.entity.R;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpServletRequest;
/**
 * wechat之web端第三方登录
 * create on 2020/08/07 by kingyifan
 */
@RestController
@RequestMapping("/wechat")
public class WechatWebLoginController {


    @Autowired
    private WechatWebLoginService wechatWebLoginService;


    /**
     * 获取生成用户点击之后能获取code的接口
     * 第一步：请求CODE
     * <p>
     * 第三方使用网站应用授权登录前请注意已获取相应网页授权作用域（scope=snsapi_login），
     * 则可以通过在PC端打开以下链接：https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
     * 若提示“该链接无法访问”，请检查参数是否填写错误，如redirect_uri的域名与审核时填写的授权域名不一致或scope不为snsapi_login。
     * 以上摘自-腾讯官方文档 ：https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html
     *
     * @param request 获取HttpServletRequest中session存放STATE
     *                STATE  用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验
     * @return URL 微信登录请求地址
     */
    @GetMapping(value = "/getCreatCodeUrl")
    @ResponseBody
    public R getCreatCodeUrl(HttpServletRequest request) {
        String getCodeUrl = wechatWebLoginService.getCreatCodeUrl(request);
        return R.ok().data(getCodeUrl);
    }


    /**
     * 通过getCreatCodeUrl方法并且用户授权之后前端页面会拿到code参数，参数会直接拼接在回调地址后面
     * <p>
     * 通过code获取access_token、openid、unionid（当且仅当该网站应用已获得该用户的userinfo授权时，才会出现该字段。）
     *
     * @param request
     * @return
     */
    @GetMapping(value = "/getUserInfoByCode")
    @ResponseBody
    public R getUserInfoByCode(HttpServletRequest request) {
        //true：state是否存放session
        return wechatWebLoginService.getInfoByCode(request);
    }
}

service接口：
package cn.cnbuilder.wechat.webLogin.service;

import cn.cnbuilder.wechat.webLogin.entity.R;

import javax.servlet.http.HttpServletRequest;
import java.util.Map;

public interface WechatWebLoginService {

    String getCreatCodeUrl(HttpServletRequest request);

    R getInfoByCode(HttpServletRequest request );

}

serviceImpl:
package cn.cnbuilder.wechat.webLogin.service.impl;

import cn.cnbuilder.wechat.webLogin.entity.R;
import cn.cnbuilder.wechat.webLogin.entity.WeChatUserInfo;
import cn.cnbuilder.wechat.webLogin.entity.WechatBaseInfo;
import cn.cnbuilder.wechat.webLogin.mapper.WechatUserInfoMapper;
import cn.cnbuilder.wechat.webLogin.service.WechatWebLoginService;
import cn.cnbuilder.wechat.webLogin.utils.WechatWebLoginUtil;
import cn.hutool.core.util.RandomUtil;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


@Service
public class WechatWebLoginServiceImpl implements WechatWebLoginService {


    @Autowired
    private WechatUserInfoMapper wechatUserInfoMapper;


    @Override
    public String getCreatCodeUrl(HttpServletRequest request) {

        //state参数：用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验
        //第一步生成随机的state参数 该参数可用于防止csrf攻击（跨站请求伪造攻击）
        String state = RandomUtil.randomString(8);
        //第二步存放session
        request.getSession().setAttribute("state", state);

        //获取用户点击url可以生成code的链接
        String getCodeUrl = WechatWebLoginUtil.getCodeUrl(state);
        return getCodeUrl;
    }

    /**
     * 根据code获取信息
     * 第一步：判断state是否和我们存放的state一致
     * <br>  不一致，则直接返回这是一次非腾讯官方的回调请求。
     * 第二步：判断用户是否同意登录（查看是否有code）
     * <br>  不同意：则直接返回登录失败
     * 第三步：判断code是否有效，是否是腾讯返回的
     * <br>  是：获取信息
     * <br>  否：这是一次无效的登录请求
     *
     * @param request
     */
    @Override
    public R getInfoByCode(HttpServletRequest request) {
        String isSetState = request.getParameter("state");
        //是否存放State
        if (isSetState != null && StringUtils.isNotEmpty(isSetState)) {
            /**
             * 第一步
             * 查看state是否和我们存放的一致；
             */
            //微信给的state
            String wstate = request.getParameter("state");
            //session中的state
            Object sstate = request.getSession().getAttribute("state");
            if (StringUtils.isEmpty(sstate.toString()) || !sstate.equals(wstate)) {
                return R.error(500, "恶意请求");
            }
        }


        /**
         *  第二步查看用户是否授权：
         *  用户允许授权后，将会重定向到redirect_uri的网址上，并且带上code和state参数
         *  redirect_uri ? code = CODE & state = STATE
         *  若用户禁止授权，则重定向后不会带上code参数，仅会带上state参数
         以上摘自微信官方文檔：https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html
         */
        //获取腾讯给的code
        String code = request.getParameter("code");
        //判断是否是空的。
        if (StringUtils.isBlank(code) || StringUtils.isEmpty(code)) {
            return R.error(500, "code为空！");
        }

        //调用微信通过code获取access_token接口
        WechatBaseInfo wechatBaseInfo = WechatWebLoginUtil.getBaseInfoByCode(code);
        if (wechatBaseInfo.getErrcode() != null) {
            return R.error(500, wechatBaseInfo.getErrmsg());
        }

        //获取到基础开发信息之后，判断用户信息在db是否完整
        QueryWrapper<WeChatUserInfo> queryWrapper = new QueryWrapper<>();
        queryWrapper.eq("openid", wechatBaseInfo.getOpenid());
        WeChatUserInfo dWeChatUserInfo = wechatUserInfoMapper.selectOne(queryWrapper);
        //用户信息不存在
        if (dWeChatUserInfo != null) {
            //如果db存在则直接返回，如果怕用户更改了资料也可以重新走一下获取用户信息接口
            return R.ok().data(dWeChatUserInfo);
        }
        //获取基础信息获取用户信息
        WeChatUserInfo wechatUserInfo = WechatWebLoginUtil.getUserInfoByOpenid(wechatBaseInfo);
        if (wechatUserInfo == null) {
            return R.error(500, "用户信息获取失败！");
        }
        wechatUserInfoMapper.insert(wechatUserInfo);
        return R.ok().data(wechatUserInfo);
    }
}

package cn.cnbuilder.wechat.webLogin.utils;

import cn.cnbuilder.wechat.webLogin.entity.WeChatUserInfo;
import cn.cnbuilder.wechat.webLogin.entity.WechatBaseInfo;
import cn.hutool.http.HttpUtil;
import cn.hutool.json.JSONObject;
import cn.hutool.json.JSONUtil;
import org.apache.commons.lang3.StringUtils;

/**
 * 微信第三方web登录工具类
 * create on 2020.08.07 by kingyifan
 */
public class WechatWebLoginUtil {


    //微信开放平台申请pc应用开发密钥 可以后期弄到配置文件动态获取
    public static String APPID = "xxxxxxxxx";
    public static String APPSECRET = "xxxxxxxxx";

    //-------------------------------------微信第三方登录信息------------------------------------------------//
    //获取codeurl下面是固定的
    public static String GETCODEURL = "https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect";

    //微信回调地址(这个地址可以说是前端页面,这个地址腾讯回调过来会在后面拼code参数)
    public static String REDIRECTURI = "http://20y85987b7.51mypc.cn/";

    //应用授权作用域，拥有多个作用域用逗号（,）分隔，网页应用目前仅填写snsapi_login
    public static String SCOPE = "snsapi_login";


    // 获取access_token 通过code获取access_token
    public static String ACCESSTOKENURL = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code";

    //根据openid获取用户信息接口地址
    public static String USERINFOURL = "https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID";

    /**
     * 拼接获取code的:接口地址
     *
     * @param state 随机数 防止csrf攻击（跨站请求伪造攻击）
     * @return
     */
    public static String getCodeUrl(String state) {
        //替换appId、回调url 以及state参数
        return GETCODEURL.replace("APPID", APPID).replace("REDIRECT_URI", REDIRECTURI).replace("SCOPE", SCOPE).replace("STATE", state);
    }

    /**
     * 根据code获取用户基础开发信息、AccessToken、openId、unionId、refreshToken
     *
     * @param code 临时授权凭证
     * @return
     */
    public static WechatBaseInfo getBaseInfoByCode(String code) {

        //基础信息实体类
        WechatBaseInfo wechatBaseInfo = new WechatBaseInfo();

        //拼接获取access_token的请求地址
        String accessTokenUrl = ACCESSTOKENURL.replace("APPID", APPID).replace("SECRET", APPSECRET).replace("CODE", code);
        //發送请求获取基础开发信息
        String getResponseInfo = HttpUtil.get(accessTokenUrl);
        if (StringUtils.isEmpty(getResponseInfo)) {
            wechatBaseInfo.setErrcode(-1);
            wechatBaseInfo.setErrmsg("错误请求");
            return wechatBaseInfo;
        }
        //把请求结果转成json对象
        JSONObject reObject = JSONUtil.parseObj(getResponseInfo);
        //判断是否有异常 比如code失效。。。。
        if (reObject.getInt("errcode") != null) {
            /**
             *  错误返回样例:
             *  {
             *     "errcode":40029,
             *     "errmsg":"invalid code"
             * }
             */
            wechatBaseInfo.setErrcode(reObject.getInt("errcode"));
            wechatBaseInfo.setErrmsg(reObject.getStr("errmsg"));
            return wechatBaseInfo;
        } else {
            /**
             *正确的返回：
             * {
             * "access_token":"ACCESS_TOKEN",
             * "expires_in":7200,
             * "refresh_token":"REFRESH_TOKEN",
             * "openid":"OPENID",
             * "scope":"SCOPE",
             * "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"
             * }
             */
            //接口调用凭证
            wechatBaseInfo.setAccess_token(reObject.getStr("access_token"));
            //access_token接口调用凭证超时时间，单位（秒）
            wechatBaseInfo.setExpires_in(reObject.getStr("expires_in"));
            //用户刷新access_token
            wechatBaseInfo.setRefresh_token(reObject.getStr("refresh_token"));
            // 	授权用户唯一标识
            wechatBaseInfo.setOpenid(reObject.getStr("openid"));
            //用户授权的作用域，使用逗号（,）分隔
            wechatBaseInfo.setScope(reObject.getStr("scope"));
            // unionid 当且仅当该网站应用已获得该用户的userinfo授权时，才会出现该字段。
            wechatBaseInfo.setUnionid(reObject.getStr("unionid"));
            return wechatBaseInfo;
        }
    }

    /**
     * 根据基础开发信息获取用户信息
     *
     * @param wechatBaseInfo
     * @return
     */
    public static WeChatUserInfo getUserInfoByOpenid(WechatBaseInfo wechatBaseInfo) {

        WeChatUserInfo weChatUserInfo = new WeChatUserInfo();

        //拼接获取userinfo的请求地址
        String userInfoUrl = USERINFOURL.replace("ACCESS_TOKEN", wechatBaseInfo.getAccess_token()).replace("OPENID", wechatBaseInfo.getOpenid());

        //發送请求获取用户信息
        String getResponseInfo = HttpUtil.get(userInfoUrl);
        if (StringUtils.isEmpty(getResponseInfo)) {
            weChatUserInfo.setErrcode(-1);
            weChatUserInfo.setErrmsg("错误请求");
            return weChatUserInfo;
        }
        //把请求结果转成json对象
        JSONObject reObject = JSONUtil.parseObj(getResponseInfo);

        //判断是否有异常 比如无效的openId
        if (reObject.getInt("errcode") != null) {
            /**
             * 错误的Json返回示例:
             * {
             *     "errcode":40003,
             *     "errmsg":"invalid openid"
             * }
             */
            weChatUserInfo.setErrcode(reObject.getInt("errcode"));
            weChatUserInfo.setErrmsg(reObject.getStr("errmsg"));
            return weChatUserInfo;
        } else {
            //普通用户的标识，对当前开发者帐号唯一
            weChatUserInfo.setOpenid(reObject.getStr("openid"));
            //普通用户昵称
            weChatUserInfo.setNickname(reObject.getStr("nickname"));
            //普通用户性别，1为男性，2为女性
            weChatUserInfo.setSex(reObject.getInt("sex"));
            // 	普通用户个人资料填写的省份
            weChatUserInfo.setProvince(reObject.getStr("province"));
            //普通用户个人资料填写的城市
            weChatUserInfo.setCity(reObject.getStr("city"));
            //国家，如中国为CN
            weChatUserInfo.setCountry(reObject.getStr("country"));
            //TODO 请注意，在用户修改微信头像后，旧的微信头像URL将会失效，因此开发者应该自己在获取用户信息后，将头像图片保存下来，避免微信头像URL失效后的异常情况。 这里需要下载用户头像然后保存到自己的服务器 这一步省略。。。
            //用户头像，最后一个数值代表正方形头像大小（有0、46、64、96、132数值可选，0代表640*640正方形头像），用户没有头像时该项为空
            weChatUserInfo.setHeadimgurl(reObject.getStr("headimgurl"));
            // 	用户特权信息，json数组，如微信沃卡用户为（chinaunicom）
            weChatUserInfo.setPrivilege(reObject.getJSONArray("privilege").toString());
            //用户统一标识。针对一个微信开放平台帐号下的应用，同一用户的unionid是唯一的。
            weChatUserInfo.setUnionid(reObject.getStr("unionid"));
            return weChatUserInfo;
        }

    }
}

R：统一返回实体：
package cn.cnbuilder.wechat.webLogin.entity;

import java.util.HashMap;
import java.util.Map;


public class R extends HashMap<String, Object> {

    private static final long serialVersionUID = -8713837118340960775L;

    public R() {
        put("code", 200);
        put("msg", "success");
    }

    public static R error() {
        return error(500, "未知异常，请联系管理员");
    }

    public static R error(String msg) {
        return error(500, msg);
    }

    public static R error(int code, String msg) {
        R r = new R();
        r.put("code", code);
        r.put("msg", msg);
        return r;
    }

    public static R ok(String msg) {
        R r = new R();
        r.put("msg", msg);
        return r;
    }

    public static R ok(Map<String, Object> map) {
        R r = new R();
        r.putAll(map);
        return r;
    }

    public static R ok() {
        return new R();
    }


    public R message(String message) {
        this.put("message", message);
        return this;
    }


    public R data(Object data) {
        this.put("data", data);
        return this;
    }

    @Override
    public R put(String key, Object value) {
        super.put(key, value);
        return this;
    }

    public String getMessage() {
        return String.valueOf(get("message"));
    }

    public Object getData() {
        return get("data");
    }


    public Integer getCode() {
        return (Integer) get("code");
    }
}
微信第三方登录基础开发信息：
package cn.cnbuilder.wechat.webLogin.entity;

import lombok.Data;

/**
 * 微信web登录基础开发信息
 * 文档地址：https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html
 */
@Data
public class WechatBaseInfo {

    /**
     * 接口调用凭证
     */
    private String access_token;

    /**
     * access_token接口调用凭证超时时间，单位（秒）
     */
    private String expires_in;

    /**
     * 用户刷新access_token
     */
    private String refresh_token;

    /**
     * 授权用户唯一标识
     */
    private String openid;

    /**
     * 用户授权的作用域，使用逗号（,）分隔
     */
    private String scope;

    /**
     * 当且仅当该移动应用已获得该用户的userinfo授权时，才会出现该字段
     */
    private String unionid;

    /**
     * 错误编码
     */
    private Integer errcode;

    /**
     * 错误信息
     */
    private String errmsg;

}
用户信息实体：
package cn.cnbuilder.wechat.webLogin.entity;

import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableName;
import lombok.Data;

import javax.persistence.Table;
import javax.persistence.Transient;
import javax.persistence.criteria.CriteriaBuilder;

@Data
@TableName("wechat_userinfo")
public class WeChatUserInfo {

    /**
     * 普通用户的标识，对当前开发者帐号唯一
     */
    private String openid;

    /**
     * 普通用户昵称
     */
    private String nickname;

    /**
     * 普通用户性别，1为男性，2为女性
     */
    private Integer sex;

    /**
     * 普通用户个人资料填写的省份
     */
    private String province;

    /**
     * 普通用户个人资料填写的城市
     */
    private String city;

    /**
     * 国家，如中国为CN
     */
    private String country;

    /**
     * 用户头像，最后一个数值代表正方形头像大小（有0、46、64、96、132数值可选，0代表640*640正方形头像），用户没有头像时该项为空
     */
    private String headimgurl;

    /**
     * 用户特权信息，json数组，如微信沃卡用户为（chinaunicom）
     */
    private String privilege;

    /**
     * 用户统一标识。针对一个微信开放平台帐号下的应用，同一用户的unionid是唯一的。
     */
    private String unionid;

    /**
     * 错误编码
     */
    @TableField(exist = false)
    private Integer errcode;

    /**
     * 错误信息
     */
    @TableField(exist = false)
    private String errmsg;

}

package cn.cnbuilder.wechat.webLogin.mapper;

import cn.cnbuilder.wechat.webLogin.entity.WeChatUserInfo;
import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import org.apache.ibatis.annotations.Mapper;

@Mapper
public interface WechatUserInfoMapper extends BaseMapper<WeChatUserInfo> {
}
xml文件：
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="cn.cnbuilder.wechat.webLogin.mapper.WechatUserInfoMapper">

</mapper>

package cn.cnbuilder.wechat.webLogin;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class PcLoginApplication {

    public static void main(String[] args) {
        SpringApplication.run(PcLoginApplication.class, args);
    }

}

application.yml文件：
spring:
  profiles:
    active: dev #选择要用那个配置文件
	
application-dev.yml文件：
#端口号访问路径
server:
  port: 12008
  servlet:
    context-path: /
#spring
spring:
  devtools:
    restart:
      enabled: true
  # mysql 配置
  datasource:
    driver-class-name: com.mysql.jdbc.Driver
    type: com.zaxxer.hikari.HikariDataSource
    url: jdbc:mysql://127.0.0.1/wechat_weblogin?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8
    username: root
    password: root
    hikari:
      ## 最小空闲连接数量
      minimum-idle: 5
      ## 空闲连接存活最大时间，默认600000（10分钟）
      idle-timeout: 180000
      ## 连接池最大连接数，默认是10
      maximum-pool-size: 10
      ## 此属性控制从池返回的连接的默认自动提交行为,默认值：true
      auto-commit: true
      ## 连接池名称
      pool-name: MyHikariCP
      ## 此属性控制池中连接的最长生命周期，值0表示无限生命周期，默认1800000即30分钟
      max-lifetime: 1800000
      ## 数据库连接超时时间,默认30秒，即30000
      connection-timeout: 30000
      ## 监听是否存活
      connection-test-query: SELECT 1
  servlet:
    multipart:
      enabled: true
      max-file-size: -1

#mybatis
mybatis-plus:
  mapper-locations: classpath:/mapper/*Mapper.xml
  #实体扫描，多个package用逗号或者分号分隔
  typeAliasesPackage: cn.cnbuilder.wechat.webLogin.entity
  global-config:
    # 数据库相关配置
    db-config:
      #主键类型  AUTO:"数据库ID自增", INPUT:"用户输入ID",ID_WORKER:"全局唯一ID (数字类型唯一ID)", UUID:"全局唯一ID UUID";
      id-type: id_worker
      #字段策略 IGNORED:"忽略判断",NOT_NULL:"非 NULL 判断"),NOT_EMPTY:"非空判断"
      field-strategy: not_empty
      #驼峰下划线转换
      column-underline: true
      #数据库大写下划线转换
      #      capital-mode: true
      #逻辑删除配置
      logic-delete-value: 0
      logic-not-delete-value: 1
    #刷新mapper 调试神器
    refresh: true
  # 原生配置
  configuration:
    map-underscore-to-camel-case: true
    cache-enabled: false

CREATE TABLE `wechat_userinfo` (
  `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '主键',
  `openid` varchar(32) DEFAULT '' COMMENT '普通用户的标识，对当前开发者帐号唯一',
  `nickname` varchar(50) DEFAULT '' COMMENT '普通用户昵称',
  `sex` int(2) DEFAULT '0' COMMENT '普通用户性别，1为男性，2为女性',
  `province` varchar(30) DEFAULT '' COMMENT ' 普通用户个人资料填写的省份',
  `city` varchar(30) DEFAULT '' COMMENT '普通用户个人资料填写的城市',
  `country` varchar(30) DEFAULT '' COMMENT '国家，如中国为CN',
  `headimgurl` varchar(200) DEFAULT '' COMMENT '用户头像，最后一个数值代表正方形头像大小（有0、46、64、96、132数值可选，0代表640*640正方形头像），用户没有头像时该项为空',
  `privilege` varchar(20) DEFAULT '' COMMENT '用户特权信息，json数组，如微信沃卡用户为（chinaunicom）',
  `unionid` varchar(32) DEFAULT '' COMMENT '用户统一标识。针对一个微信开放平台帐号下的应用，同一用户的unionid是唯一的。',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8mb4;

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
	</head>
	<body>
	 <h2>KingYiFan微信第三方登录测试之内嵌二维码</h2>
	 <div id="login_container"></div>
	</body>
	<script>
		var obj = new WxLogin({
			  self_redirect:false,
			  id:"login_container", 
			  appid: "wxeaxxxxxxx41a91a", 
			  scope: "snsapi_login", 
			  redirect_uri: "http://20y85987b7.51mypc.cn",
			  state: "",
			  style: "black",
			  href: "http://127.0.0.1:8848/yifantest/css/wechatLogin.css"
			});
	</script>
</html>
css样式：
.impowerBox .qrcode {width: 200px;}
.impowerBox .title {display: none;}
.impowerBox .info {width: 200px;}
.impowerBox .status {text-align: center;}