微信小程序手机号码授权登录

文章目录


一、微信小程序开发

目前个人的小程序无法使用手机号码授权登录,可以使用测试号进行开发

二、使用步骤

1.前端代码

代码如下(示例):

html 复制代码
<button open-type="getPhoneNumber" bindgetphonenumber="getUserPhoneNumber">立即登录</button>
javascript 复制代码
Page({

getUserPhoneNumber(event) {
    if(event.detail.errMsg != "getPhoneNumber:ok") {
      // 授权失败
      return false;
    }
    // 发起请求,进行授权登录
    wx.request({
      url: app.globalData.basePath + '/system/applet/login',
      data: {
        phoneCode: event.detail.code
      },
      method:'POST',
      success: res => {
        console.log(res.data);
        wx.setStorageSync('applet', res.data);
      }
    })
  }
}}

2.后台配置

java 复制代码
# 小程序配置
applet:
  appId: wx53fda****c6b0a3
  appSecret: ade99d6dca77****f52fecd5d35039b5
  grantType: authorization_code

3.后台代码

代码如下(示例):

java 复制代码
package com.ruoyi.system.domain.io;

public class AppletLoginInput {

    private String phoneCode;

    private String iv;

    private String encryptedData;

    public String getPhoneCode() {
        return phoneCode;
    }

    public void setPhoneCode(String phoneCode) {
        this.phoneCode = phoneCode;
    }

    public String getIv() {
        return iv;
    }

    public void setIv(String iv) {
        this.iv = iv;
    }

    public String getEncryptedData() {
        return encryptedData;
    }

    public void setEncryptedData(String encryptedData) {
        this.encryptedData = encryptedData;
    }
}
java 复制代码
package com.ruoyi.system.domain.io;

public class AppletLoginOutput {

    /**
     * token信息
     */
    private String token;

    public String getToken() {
        return token;
    }

    public void setToken(String token) {
        this.token = token;
    }
}
java 复制代码
/**
 * 微信小程序手机号码授权登录
 * @param input
 */
@Anonymous
@PostMapping("/login")
public AppletLoginOutput login(@RequestBody AppletLoginInput input) {
    AppletLoginOutput appletLoginOutput = new AppletLoginOutput();
    // 首先获取最新的token信息
    String tokenParam = "appid=" + appletConfig.getAppId() + "&secret=" + appletConfig.getAppSecret() + "&grant_type=client_credential";
    String tokenResult = HttpUtils.sendGet("https://api.weixin.qq.com/cgi-bin/token", tokenParam);
    JSONObject tokenJSONObject = JSONObject.parseObject(tokenResult);

    // 通过登录信息获取用户的手机号码
    // 获取token 信息
    String body = "{\"code\": \"" + input.getPhoneCode() + "\"}";
    HttpRequest post = HttpUtil.createPost("https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=" + tokenJSONObject.getString("access_token"));
    post.header("Content-Type", "application/json");
    post.body(body);
    HttpResponse execute = post.execute();
    AppletResultModel resultModel = JSONObject.parseObject(execute.body(), AppletResultModel.class);
    String jsonString = JSONObject.toJSONString(resultModel);
    System.out.println(jsonString);
    // {"errcode":0,"errmsg":"ok","phone_info":{"countryCode":"86","phoneNumber":"178****3721","purePhoneNumber":"178****3721","watermark":{"appid":"wx53fda****1c6b0a3","timestamp":1754865784}}}
    return appletLoginOutput;
}

总结

人生物语:别哭泣,别叹息。悲伤唤不回逝去的时光。做一个简单的人,看得清世间繁杂却不在心中留下痕迹,保持平常心,简单,快乐。请别把我当傻瓜,有些事不是我不知道,只是我看在眼里,埋在心里。一个人最好记性不要太好,因为回忆越多,幸福感越少。

相关推荐
文慧的科技江湖16 小时前
OCPP 1.6 与 2.0.1 核心消息差异对照表 - 慧知开源充电桩平台
小程序·开源·ocpp协议·慧知开源充电桩平台
Greg_Zhong16 小时前
微信小程序中便捷实现自定义底部tab栏
微信小程序·自定义底部tab
LXXgalaxy17 小时前
微信小程序“记住密码”功能的实现与落地 vue3+ts的细致解析
微信小程序·小程序·notepad++
Greg_Zhong17 小时前
微信小程序中使用【免费商用】字体的下载和初步认识和使用
微信小程序·阿里巴巴、站酷·腾讯云对象存储(cos)
克里斯蒂亚诺更新17 小时前
微信小程序 腾讯地图 点聚合 简单示例
微信小程序·小程序·notepad++
Geek_Vision18 小时前
鸿蒙原生APP接入小程序运行能力:数字园区场景实战复盘
微信小程序·harmonyos
CRMEB系统商城19 小时前
国内开源电商系统的格局与演变——一个务实的技术视角
java·大数据·开发语言·小程序·开源·php
2501_9160074719 小时前
iOS逆向工程:详细解析ptrace反调试机制的破解方法与实战步骤
android·macos·ios·小程序·uni-app·cocoa·iphone
00后程序员张20 小时前
前端可视化大屏制作全指南:需求分析、技术选型与性能优化
前端·ios·性能优化·小程序·uni-app·iphone·需求分析
January12071 天前
Taro3 + Vue3 小程序文件上传组件,支持 PDF/PPTX 跨端使用
小程序