微信小程序获取手机号的完整实例(Java后台实现)

目录
  • 小程序
  • 后端接口
  • 总结

小程序端:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html

获取手机号码:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/phonenumber/phonenumber.getPhoneNumber.html

获取token:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/access-token/auth.getAccessToken.html

现在的获取手机号码变得很简单,不需要像之前那样去根据偏移量解析密文了,现在直接使用code去微信后台换取号码即可,这里简单记录一下。

小程序

首先小程序端很简单,直接调用API获取code即可,然后将code作为参数传递给接口。

<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"></button>
Page({
  getPhoneNumber (e) {
    console.log(e.detail.code)
  }
})
参数 类型 说明 最低版本
code String 动态令牌。可通过动态令牌换取用户手机号。使用方法详情 phonenumber.getPhoneNumber 接口  

后端接口

开发接口的时候需要注意以下几点:

  • 首先需要获取一个access_token
  • access_token是直接跟在url后面的,不需要作为参数处理
  • code参数是json格式的

调用地址如下:

POST https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=ACCESS_TOKEN

请求参数:

属性 类型 默认值 必填 说明
access_token / cloudbase_access_token string   接口调用凭证
code string   手机号获取凭证

了解了这些之后,我们就可以直接编写我们的接口了。

@Autowired
private RestTemplate restTemplate;

@PostMapping("/wx/getPhone")
public R getPhone(@RequestParam(value = "code", required = false) String code) {
    // 获取token
    String token_url = String.format("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=%s&secret=%s", WXConstant.APPID, WXConstant.SECRET);
    JSONObject token = JSON.parseObject(HttpUtil.get(token_url));

    // 使用前端code获取手机号码 参数为json格式
    String url = "https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=" + token.getString("access_token");
    Map<String, String> paramMap = new HashMap<>();
    paramMap.put("code", code);
    HttpHeaders headers = new HttpHeaders();
    HttpEntity<Map<String, String>> httpEntity = new HttpEntity<>(paramMap, headers);
    System.out.println(httpEntity);
    ResponseEntity<Object> response = restTemplate.postForEntity(url, httpEntity, Object.class);
    return R.ok().message("获取手机号码成功.").data(response.getBody());
}

这里获取token的时候我是直接使用Hutool工具包提供的工具类开发的,大家可以自行引入,

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

然后,获取手机号码这里我是采用RestTemplate来调用的,相关配置文件如下:

@Configuration
public class RestTemplateConfig {

    @Bean
    public RestTemplate restTemplate() {
        return new RestTemplate();
    }

    @Bean
    public ClientHttpRequestFactory simpleClientHttpRequestFactory() {
        SimpleClientHttpRequestFactory factory = new SimpleClientHttpRequestFactory();
        factory.setReadTimeout(5000);//ms
        factory.setConnectTimeout(15000);//ms
        return factory;
    }
}

总结

到此这篇关于微信小程序获取手机号的文章就介绍到这了,更多相关微信小程序获取手机号内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • 微信小程序 判断手机号的实现代码

    微信小程序 判断是否是手机号 JS实现代码: validatemobile: function (mobile) { if (mobile.length == 0) { wx.showToast({ title: '请输入手机号!', icon: 'success', duration: 1500 }) return false; } if (mobile.length != 11) { wx.showToast({ title: '手机号长度有误!', icon: 'success', dur

  • 微信小程序手机号码验证功能的实例代码

    wxml <form bindsubmit='formSubmit'> <view class='all'> <text>手机号:</text> <input name="phone" placeholder='请输入手机号' type='number' style='color:#333' placeholder-style="color:#666" maxlength="11" bindi

  • 微信小程序如何获取用户手机号

    最近在做一款微信小程序,需要获取用户手机号,具体步骤如下: 流程图: 1.首先,客户端调用wx.login,回调数据了包含jscode,用于获取openid(用户唯一标识)和sessionkey(会话密钥). 2.拿到jscode后,将其发送给服务端,服务端拿它与微信服务端做交互获取openid和sessionkey.具体获取方法如下: (1)需要写一个HttpUrlConnection工具类: public class MyHttpUrlConnection { private final i

  • 微信小程序利用云函数获取手机号码

    小程序获取手机号码方式 一.取到加密数据,然后提交到服务器解密, 二.获取到 cloudID,用云函数, 优点:直接获取原始数据,节省服务器资源 1.xml <button class="gettel" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"> 快捷获取</button> 2. 点击按钮调用云函数,将cloudID传给云函数 getPho

  • 微信小程序获取用户绑定手机号方法示例

    用户调用wx.login()方法,获取登录用户凭证code wx.login({ success: function(res) { console.log('loginCode', res.code) } }); code传给后台,凭证code获取session_key和openid https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=aut

  • 微信小程序绑定手机号获取验证码功能

    微信小程序验证码获取方式,代码如下所示: <!-- 绑定手机号 --> <view class='content'> <form bindsubmit="formSubmit"> <view class='phone-box'> <text class='phone'>手机号</text> <input name="phone" type='number' placeholder=&quo

  • 微信小程序获取手机号授权用户登录功能

    小程序中有很多地方都会用到注册用户信息的地方,用户需要填写手机号等,有了这个组件可以快速获取微信绑定手机号码,无须用户填写. 1.getPhoneNumber这个组件通过button来实现(别的标签无效).将button中的open-type="getPhoneNumber",并且绑定bindgetphonenumber事件获取回调. <span style="font-size:14px;"><button open-type="get

  • 微信小程序获取手机号的完整实例(Java后台实现)

    目录 小程序 后端接口 总结 小程序端:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html 获取手机号码:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/phonenumber/phonenumber.getPhoneNumber.html 获取token:https://d

  • 微信小程序获取手机号,后端JAVA解密流程代码

    小程序获取手机号,后端JAVA解密流程代码 微信官方文档获取手机号流程地址,先看下最好方便理解下面步骤 实现思路,步骤如下 1.前端需先调用官方wx.login接口获取登录凭证code. 2.后端接收code 调用官方接口地址获取用户秘钥 sessionKey. 3.前端通过官方getPhoneNumber获取encryptedData,iv 4.前端通过参数**[encryptedData] .[iv] .[sessionKey]** 发送请求后端接口,解密用户手机号 小程序获取session

  • 微信小程序 获取二维码实例详解

     微信小程序 获取二维码实例详解 理论: 接口A: 适用于需要的码数量较少的业务场景 接口地址:(永久有效,数量有限,进入path对应的页面) https://api.weixin.qq.com/wxa/getwxacode?access_token=ACCESS_TOKEN path String 不能为空,最大长度 128 字节 width Int 430(默认) 二维码的宽度 auto_color .. line_color .. 接口B:适用于需要的码数量极多,或仅临时使用的业务场景(永

  • 微信小程序 获取手机号 JavaScript解密示例代码详解

    当我们在开发微信小程序中,有一个常用的功能,就是获取用户的手机号,然后一键登入小程序,那么手机号如何获取呢?请认真看完本文,保证可以获取到用户的手机号. 刚开始开发微信小程序的时候,想着实现手机验证码登入,后来查阅资料得知,发给用户的短信是要自己付费的.后来想想,微信获取用户的手机号一样可以保证手机号码的真实性,因为手机号既然可以绑定微信,那么肯定是被严格核验过的,然后就开始了获取手机号之旅,网上教程有很多,但不知什么原因,都是会少一些内容,有的只有前端代码,没有后端:有的后端代码是PHP,不是

  • 微信小程序获取手机号的踩坑记录

    前言 最近在开发小程序遇到这样一个问题, 在用户点击授权后去解密手机号时会出现第一次失败,第二次成功的情况.研究了一段时间,终于找到比较合理的解决方案,在此记录并总结一下,希望可以帮助到大家. 需求描述 在用户点击获取电话按钮后, 将用户在微信内设置的电话解密显示在联系电话输入框内 具体代码 <view class="cu-form-group"> <view class="title text-black">联系电话</view>

  • uniapp+.net core实现微信小程序获取手机号功能

    目录 获取手机号 注意: 使用方法 前端 template js 后端 appsetting配置 Startup.cs GlobalContext.cs 调用 获取截图 获取手机号 从基础库 2.21.2 开始,对获取手机号的接口进行了安全升级,以下是新版本接口使用指南.( 旧版本接口 目前可以继续使用,但建议开发者使用新版本接口,以增强小程序安全性) 因为需要用户主动触发才能发起获取手机号接口,所以该功能不由 API 来调用,需用 button 组件的点击来触发.另外,新版本接口 不再 需要提

  • 微信小程序判断手机号是否合法的实例代码

    目录 场景 效果 代码 总结 场景 在注册页面输入手机号,在请求注册接口前先行判别输入的手机号码是否合法: 效果 代码 导入 vant-weapp 组件:user-register.json { "usingComponents": { "van-cell-group": "@vant/weapp/cell-group/index", "van-field": "@vant/weapp/field/index&quo

  • 微信小程序文章详情功能完整实例

    本文实例讲述了微信小程序文章详情功能.分享给大家供大家参考,具体如下: 接着上一篇 https://www.jb51.net/article/187900.htm list.js  首先获取文章的id,因为我们的数据是假数据所以用key值作为文章id onPostTap: function (event) { var article_id = event.currentTarget.dataset.aid; wx.navigateTo({ url: '../article-detail/deta

  • 微信小程序文章列表功能完整实例

    本文实例讲述了微信小程序文章列表功能.分享给大家供大家参考,具体如下: 没有服务器接口数据的情况下玩一玩. list.wxml <view> <swiper class='swiper' indicator-dots="true" indicator-color="rgba(0, 0, 0, .3)" autoplay="true" interval="2000" easing-function="

随机推荐