uniapp 支付宝授权登录

### UniApp 中实现支付宝授权登录功能 #### 前端部分：UniApp 的支付宝小程序授权登录逻辑 在 UniApp 中实现支付宝授权登录，主要依赖于支付宝开放平台提供的接口以及 UniApp 对原生插件的支持。以下是具体的前端代码示例： ```javascript // 调用支付宝授权登录方法 onLoad: function () { my.getAuthCode({ scopes: 'auth_base', // 授权类型，可选 auth_user 或 auth_base success: (res) => { console.log('获取授权码成功:', res.authCode); // 将 authCode 发送到后端换取 userId 和其他信息 uni.request({ url: 'https://your-backend-api.com/login/alipay', method: 'POST', data: { authCode: res.authCode, }, success: (response) => { if (response.data.success) { console.log('用户ID:', response.data.userId); // 存储用户信息到本地缓存或其他地方 uni.setStorageSync('userId', response.data.userId); } else { console.error('登录失败:', response.data.message); } }, fail: (err) => { console.error('请求失败:', err); }, }); }, fail: (error) => { console.error('获取授权码失败:', error); }, }); } ``` 以上代码实现了调用 `my.getAuthCode` 方法获取用户的授权码，并将其发送至 Java 后端以交换用户 ID。 --- #### 后端部分：Java 后端处理授权码并获取用户信息 在 Java 后端中，可以通过支付宝开放平台 API 使用授权码 (`authCode`) 获取用户的唯一标识符 (`userId`) 及其他信息。以下是一个简单的 Spring Boot 示例代码： ```java @RestController @RequestMapping("/login") public class AlipayLoginController { @PostMapping("/alipay") public ResponseEntity<?> alipayLogin(@RequestBody Map<String, String> requestData) throws Exception { String authCode = requestData.get("authCode"); // 构造请求参数 AlipaySystemOauthTokenRequest request = new AlipaySystemOauthTokenRequest(); request.setCode(authCode); request.setGrantType("authorization_code"); // 设置应用私钥和公钥配置（需提前初始化） DefaultAlipayClient client = new DefaultAlipayClient( "https://openapi.alipay.com/gateway.do", "your_app_id", "your_private_key", "json", "utf-8", "alipay_public_key", "RSA2" ); // 执行请求 AlipaySystemOauthTokenResponse oauthTokenResponse = client.execute(request); if ("success".equals(oauthTokenResponse.getCode())) { String accessToken = oauthTokenResponse.getAccessToken(); // 访问令牌 String refreshToken = oauthTokenResponse.getRefreshToken(); // 刷新令牌 // 查询用户信息 AlipayUserInfoShareRequest userInfoRequest = new AlipayUserInfoShareRequest(); AlipayUserInfoShareResponse userInfoResponse = client.execute(userInfoRequest, accessToken); if (!"success".equals(userInfoResponse.getCode())) { return ResponseEntity.status(HttpStatus.BAD_REQUEST).body(Map.of("message", "无法获取用户信息")); } String userId = userInfoResponse.getUserId(); // 用户唯一标识 return ResponseEntity.ok(Map.of("userId", userId)); } else { return ResponseEntity.status(HttpStatus.UNAUTHORIZED).body(Map.of("message", "授权失败")); } } } ``` 此代码展示了如何接收来自前端的 `authCode` 并通过支付宝官方 SDK 请求访问令牌 (`accessToken`) 和刷新令牌 (`refreshToken`)，进而查询用户基本信息。 --- #### iOS 如何跳回 App 对于 iOS 设备上的跳转问题，在某些情况下可能需要额外设置 URL Scheme 来支持从浏览器或 H5 页面跳回到 App。具体做法如下： 1. **注册 URL Scheme** 在 Xcode 项目中，打开 `Info.plist` 文件，添加一个新的键值对： ```xml <key>CFBundleURLTypes</key> <array> <dict> <key>CFBundleURLSchemes</key> <array> <string>your-app-scheme</string> </array> </dict> </array> ``` 2. **监听回调事件** 在 App 启动时捕获 URL Scheme 参数，提取其中携带的 `authCode` 并传递给后端验证。 ```javascript onShow: function() { setTimeout(() => { const args = plus.runtime.arguments; if (args && args.includes('authCode')) { plus.runtime.arguments = null; // 清空参数防止重复触发 const authCode = extractAuthCodeFromArgs(args); // 自定义解析函数 sendAuthCodeToBackend(authCode); // 将 authCode 提交给后端 } }, 0); } ``` --- #### 注意事项 - 需要在支付宝开发者平台上创建应用并配置合法的重定向 URI[^1]。 - 如果涉及跨平台兼容性问题，建议测试不同操作系统下的行为差异[^2]。 - 安全起见，避免直接暴露敏感数据，如私钥等[^1]。 ---