Spring Boot+微信小程序开发平台保存微信登录者的个人信息

这里提供一份完整的“Spring Boot + 微信小程序开发平台保存微信登录者的个人信息”的攻略，下面将分为以下几个方面进行讲解。

1. 小程序登录流程

在小程序中，用户登录的流程如下：

1. 用户进入小程序，点击登录按钮。
2. 微信端会弹出授权窗口，提示用户是否授权小程序登录。
3. 用户点击同意授权后，微信将会返回一个 code 值给小程序端。
4. 小程序端通过 code 值，使用微信提供的接口向服务器请求用户的 openId 和 sessionKey。
5. 服务器返回 openId 和 sessionKey 给小程序端，小程序端将 openId 和 sessionKey 保存在客户端本地。

2. Spring Boot 初始化配置

在 Spring Boot 中，我们需要进行一些初始化配置，以便能够使用微信提供的接口来获取用户的信息。具体的配置步骤如下：

1. 在 application.properties 中添加微信相关的配置项：

# 微信小程序配置项
wx.miniapp.appid = ${WX_MINIAPP_APPID}
wx.miniapp.secret = ${WX_MINIAPP_SECRET}
wx.miniapp.grant_type = ${WX_MINIAPP_GRANT_TYPE}

其中，WX_MINIAPP_APPID，WX_MINIAPP_SECRET，WX_MINIAPP_GRANT_TYPE 是从微信开放平台上获取的应用 ID、密钥和授权类型。

1. 创建 WechatConfig 类，用于读取微信的配置信息：

@Configuration
@ConfigurationProperties(prefix = "wx.miniapp")
public class WechatConfig {

    private String appid;

    private String secret;

    private String grantType;

    // getter 和 setter 方法
}

1. 在 WechatService 中，实现获取用户信息的方法：

@Service
public class WechatService {

    private final RestTemplate restTemplate;

    private final WechatConfig wechatConfig;

    @Autowired
    public WechatService(RestTemplate restTemplate, WechatConfig wechatConfig) {
        this.restTemplate = restTemplate;
        this.wechatConfig = wechatConfig;
    }

    public WechatUserInfo getUserInfo(String code) {
        String urlTemplate = "https://api.weixin.qq.com/sns/jscode2session?appid=%s&secret=%s&js_code=%s&grant_type=%s";
        String url = String.format(
                urlTemplate,
                wechatConfig.getAppid(),
                wechatConfig.getSecret(),
                code,
                wechatConfig.getGrantType());
        return restTemplate
                .getForObject(url, WechatUserInfo.class);
    }
}

其中，WechatUserInfo 是微信返回的用户信息；RestTemplate 是 Spring 提供的用于发送 REST 请求的工具。

3. 小程序端代码实现

在小程序端，我们需要进行如下的实现步骤：

1. 在 app.js 中保存 openId 和 sessionKey：

App({
  globalData: {
    openId: null,
    sessionKey: null
  },
  onLaunch: function () {
    // 获取用户信息
    wx.login({
      success: res => {
        if (res.code) {
          // 发送 res.code 到后台换取 openId, sessionKey, unionId
          wx.request({
            url: 'http://localhost:8080/user/login',
            data: {
              code: res.code
            },
            success: res => {
              console.log(res.data);
              this.globalData.openId = res.data.openid;
              this.globalData.sessionKey = res.data.session_key;
            }
          })
        }
      }
    })
  }
})

1. 在需要获取用户信息的页面中，调用 wx.getUserInfo 获取用户的详细信息：

wx.getUserInfo({
  success: res => {
    console.log(res.userInfo);
    // 发送用户信息到后台保存
    wx.request({
      url: 'http://localhost:8080/user',
      method: 'POST',
      header: {
        'content-type': 'application/json'
      },
      data: {
        openid: app.globalData.openId,
        name: res.userInfo.nickName,
        avatarUrl: res.userInfo.avatarUrl,
        gender: res.userInfo.gender,
        city: res.userInfo.city,
        province: res.userInfo.province,
        country: res.userInfo.country
      },
      success: res => {
        console.log(res.data);
      }
    })
  }
})

示例说明

这里提供两个示例，一个是 Spring Boot 项目中的接口实现，代码如下：

@RestController
@RequestMapping("/user")
public class UserController {

    private final UserService userService;

    public UserController(UserService userService) {
        this.userService = userService;
    }

    @PostMapping
    public User userInfo(@RequestBody User user) {
        return userService.saveUser(user);
    }

    @GetMapping("/{id}")
    public User getUser(@PathVariable Long id) {
        return userService.getUserById(id);
    }

    @PostMapping("/login")
    public WechatUserInfo wechatLogin(String code) {
        return userService.getWechatUserInfo(code);
    }
}

另一个是小程序端的页面实现，代码如下：

// pages/user/user.js
const app = getApp()

Page({
  data: {
    userInfo: {}
  },
  onLoad: function() {
    wx.getUserInfo({
      success: res => {
        this.setData({
          userInfo: res.userInfo
        })
      }
    })
  },
  saveUserInfo: function() {
    wx.getUserInfo({
      success: res => {
        console.log(res.userInfo);
        // 发送用户信息到后台保存
        wx.request({
          url: 'http://localhost:8080/user',
          method: 'POST',
          header: {
            'content-type': 'application/json'
          },
          data: {
            openid: app.globalData.openId,
            name: res.userInfo.nickName,
            avatarUrl: res.userInfo.avatarUrl,
            gender: res.userInfo.gender,
            city: res.userInfo.city,
            province: res.userInfo.province,
            country: res.userInfo.country
          },
          success: res => {
            console.log(res.data);
          }
        })
      }
    })
  }
})

以上就是“Spring Boot + 微信小程序开发平台保存微信登录者的个人信息”的攻略内容。