springboot 微信小程序 实现获取手机号登录

要在 Spring Boot 应用中实现与微信小程序的手机号登录功能，首先需要了解微信小程序的登录机制以及如何将其与 Spring Boot 后端整合。

1. 微信小程序的手机号登录机制

微信小程序的手机号登录通常涉及以下几个步骤：

1. 用户在小程序中点击“手机号登录”按钮，获取用户手机号。
2. 小程序向微信服务器请求手机号，通过 wx.login 获取用户的登录凭证（code）。
3. 通过 code 请求微信服务器，获得用户的 session_key 和 openid。
4. 通过 session_key 和用户提供的手机号，进行手机号绑定或验证。

2. 整合过程

2.1 配置微信开发者账号

在开始之前，你需要在微信公众平台注册并配置小程序，获取到 AppID 和 AppSecret。这两个参数在微信开发者控制台中可以找到。

2.2 设置 Spring Boot 项目

1. 创建 Spring Boot 项目：使用 Spring Initializr 创建一个新的 Spring Boot 项目，选择必要的依赖，比如 Spring Web 和 Spring Data JPA。

添加依赖：

在 pom.xml 文件中添加微信相关的依赖，例如：

<dependency>
    <groupId>com.github.wxpay</groupId>
    <artifactId>wxpay-java-sdk</artifactId>
    <version>1.0.0</version>
</dependency>

2.3 配置微信小程序相关参数

在 application.yml 或 application.properties 文件中配置微信小程序的 AppID 和 AppSecret：

wechat:
  appid: your_app_id
  secret: your_app_secret

2.4 实现微信登录 API

创建微信服务类：负责与微信服务器的通信，获取 session_key 和 openid。

@Service
public class WeChatService {

    @Value("${wechat.appid}")
    private String appId;

    @Value("${wechat.secret}")
    private String appSecret;

    private static final String LOGIN_URL = "https://api.weixin.qq.com/sns/jscode2session";

    public String getSessionKey(String code) throws IOException {
        String url = LOGIN_URL + "?appid=" + appId + "&secret=" + appSecret + "&js_code=" + code + "&grant_type=authorization_code";
        RestTemplate restTemplate = new RestTemplate();
        ResponseEntity<String> response = restTemplate.getForEntity(url, String.class);
        return response.getBody();
    }
}

实现登录控制器：处理小程序发送的登录请求，并返回 session_key 和 openid。

@RestController
@RequestMapping("/api/wechat")
public class WeChatController {

    @Autowired
    private WeChatService weChatService;

    @PostMapping("/login")
    public ResponseEntity<String> login(@RequestParam String code) {
        try {
            String response = weChatService.getSessionKey(code);
            return ResponseEntity.ok(response);
        } catch (IOException e) {
            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body("Failed to get session key");
        }
    }
}

2.5 实现手机号绑定功能

创建手机号绑定服务：

@Service
public class PhoneNumberService {

    // 这里假设你已经有一个用户实体 User 和用户服务 UserService
    @Autowired
    private UserService userService;

    public void bindPhoneNumber(String openId, String phoneNumber) {
        User user = userService.findByOpenId(openId);
        if (user != null) {
            user.setPhoneNumber(phoneNumber);
            userService.save(user);
        }
    }
}

创建手机号绑定控制器：

@RestController
@RequestMapping("/api/phone")
public class PhoneNumberController {

    @Autowired
    private PhoneNumberService phoneNumberService;

    @PostMapping("/bind")
    public ResponseEntity<String> bindPhoneNumber(@RequestParam String openId, @RequestParam String phoneNumber) {
        phoneNumberService.bindPhoneNumber(openId, phoneNumber);
        return ResponseEntity.ok("Phone number bound successfully");
    }
}

3. 微信小程序端代码

获取 code 和手机号：

wx.login({
    success: function (res) {
        if (res.code) {
            // 发起网络请求获取 session_key 和 openid
            wx.request({
                url: 'https://yourdomain.com/api/wechat/login',
                method: 'POST',
                data: {
                    code: res.code
                },
                success: function (response) {
                    const sessionData = response.data;
                    // 获取手机号
                    wx.getPhoneNumber({
                        success: function (res) {
                            // 将手机号发送到服务器进行绑定
                            wx.request({
                                url: 'https://yourdomain.com/api/phone/bind',
                                method: 'POST',
                                data: {
                                    openId: sessionData.openid,
                                    phoneNumber: res.phoneNumber
                                },
                                success: function (res) {
                                    console.log('Phone number bound successfully');
                                }
                            });
                        }
                    });
                }
            });
        }
    }
});

4. 完整示例代码

假设你的 Spring Boot 项目已经包含了所有必需的依赖和配置，以下是整合后的关键代码：

微信服务类 (WeChatService.java):

@Service
public class WeChatService {
   
    @Value("${wechat.appid}")
    private String appId;
   
    @Value("${wechat.secret}")
    private String appSecret;
   
    private static final String LOGIN_URL = "https://api.weixin.qq.com/sns/jscode2session";
   
    public String getSessionKey(String code) throws IOException {
        String url = LOGIN_URL + "?appid=" + appId + "&secret=" + appSecret + "&js_code=" + code + "&grant_type=authorization_code";
        RestTemplate restTemplate = new RestTemplate();
        ResponseEntity<String> response = restTemplate.getForEntity(url, String.class);
        return response.getBody();
    }
}

微信控制器 (WeChatController.java):

@RestController
@RequestMapping("/api/wechat")
public class WeChatController {
   
    @Autowired
    private WeChatService weChatService;
   
    @PostMapping("/login")
    public ResponseEntity<String> login(@RequestParam String code) {
        try {
            String response = weChatService.getSessionKey(code);
            return ResponseEntity.ok(response);
        } catch (IOException e) {
            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body("Failed to get session key");
        }
    }
}

手机号绑定服务类 (PhoneNumberService.java):

@Service
public class PhoneNumberService {
   
    @Autowired
    private UserService userService;
   
    public void bindPhoneNumber(String openId, String phoneNumber) {
        User user = userService.findByOpenId(openId);
        if (user != null) {
            user.setPhoneNumber(phoneNumber);
            userService.save(user);
        }
    }
}

微信小程序端代码 (app.js):

wx.login({
    success: function (res) {
        if (res.code) {
            wx.request({
                url: 'https://yourdomain.com/api/wechat/login',
                method: 'POST',
                data: {
                    code: res.code
                },
                success: function (response) {
                    const sessionData = response.data;
                    wx.getPhoneNumber({
                        success: function (res) {
                            wx.request({
                                url: 'https://yourdomain.com/api/phone/bind',
                                method: 'POST',
                                data: {
                                    openId: sessionData.openid,
                                    phoneNumber: res.phoneNumber
                                },
                                success: function (res) {
                                    console.log('Phone number bound successfully');
                                }
                            });
                        }
                    });
                }
            });
        }
    }
});

以上代码提供了一个微信小程序手机号登录功能的基本实现过程。实际开发中可能还需要处理异常情况、数据验证和安全性问题。希望这些代码和步骤对你有所帮助！