微信小程序电话号码授权

前端:

文档:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html

uniapp调用的时候,要将bind用@替换

html 复制代码
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"></button>
js 复制代码
function getPhoneNumber(e){
  console.log(e.detail.code)  // 动态令牌
  console.log(e.detail.errMsg) // 回调信息(成功失败都会返回)
  console.log(e.detail.errno)  // 错误码(失败时返回)

  if (e.detail.code){
    User.getUserTelNumber(e.detail.code).then(res=>{
      // 授权成功
      setTimeout(()=>{
        uni.navigateBack({
          delta:1 //返回的页面层级,1为返回上一个页面
        })
      },1000)
    }).catch((err)=>{
      console.log(err,"errrrrrr")
    })
  }else{
    // 拒绝授权
    toast("拒绝授权","error")
    setTimeout(()=>{
      uni.navigateBack({
        delta:1 //返回的页面层级,1为返回上一个页面
      })
    },1000)
  }

}

java:

文档:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/user-info/phone-number/getPhoneNumber.html

掉这个获取电话号码,需要先获取access_token

https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/mp-access-token/getAccessToken.html

获取token,有效期是两小时,需要缓存,

java 复制代码
    @GetMapping("/getTelNumber")
    @LoginRequired
    @ApiOperation(value = "getTelNumber",notes = "getTelNumber")
    public RespBean getTelNumber(String code){

        userService.getWechatTelNumber(code);

        return RespBean.ok("授权成功");

    }
java 复制代码
    /**
     * 获取微信的 accessToken,, 需要缓存起来,,, 两小时过期
     * @return
     */
    public String getAccessToken(){

        String tokenUrl = String.format("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=%s&secret=%s", wechatPayConfig.getAppId(), wechatPayConfig.getAppSecret());
        Map map = restTemplate.getForObject(tokenUrl, Map.class);
        String accessToken = (String) map.get("access_token");

        System.out.println("accessToken = " + accessToken);
        return accessToken;
    }
java 复制代码
    public void getWechatTelNumber(String code) {
        try {
            String accessToken= globalMap.get("access_token");
            if (accessToken == null){
                 accessToken = getAccessToken();
                globalMap.put("access_token",accessToken);
            }


            //通过token和code来获取用户手机号
            String url = "https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=" + accessToken + "&code=" + code;

            Map<String, String> map = new HashMap<>();
            map.put("code",code);

            Object obj = restTemplate.postForObject(url, map, Object.class);
            System.out.println("obj = " + obj);

            Map<String,Object> resultMap = (Map<String,Object>) obj;

            Map<String,Object> phoneInfo = (Map<String, Object>) resultMap.get("phone_info");

            System.out.println("phoneInfo = " + phoneInfo);

            String phoneNumber = (String) phoneInfo.get("phoneNumber");

            // 将number更新到user表
            User user = SecurityContextHolder.getUser();
            user.setTel(phoneNumber);
            this.updateById(user);
        } catch (RestClientException e) {
            throw new ServiceException(e.getMessage());
        }


    }

因为授权手机号,必须要通过点击按钮,,用户授权,不能够直接调api,,必须要按钮,,可以将按钮展示为一个授权页面,,跳过去授权,,成功之后跳回

引用:https://blog.csdn.net/qq_46940224/article/details/136865901

https://blog.csdn.net/weixin_41698051/article/details/97777993

相关推荐
2501_916008898 分钟前
iOS 发布全流程详解,从开发到上架的流程与跨平台使用 开心上架 发布实战
android·macos·ios·小程序·uni-app·cocoa·iphone
小岛前端2 小时前
🔥Vue3 移动端组件精选!满足各种场景!
前端·vue.js·微信小程序
cesske3 小时前
uniapp 编译支付宝小程序canvas 合成图片实例,支付宝小程序 canvas 渲染图片 可以换成自己的图片即可
小程序·uni-app·apache
從南走到北5 小时前
JAVA代泊车接机送机服务代客泊车系统源码支持小程序+APP+H5
java·开发语言·微信小程序·小程序
木易 士心11 小时前
组织架构树形选择组件使用说明(Vue3 + UniApp)
微信小程序·钉钉·notepad++
软件技术员13 小时前
微信小程序电子测宅堪墓风水罗盘
微信小程序·小程序
future_studio13 小时前
聊聊 Unity(小白专享、C# 小程序 之 播放器)
unity·小程序·c#
Q_Q51100828513 小时前
python+uniapp基于微信小程序的旅游信息系统
spring boot·python·微信小程序·django·flask·uni-app·node.js
小Tomkk14 小时前
Rokid 开发空间小程序 实战
3d·小程序·rokid·jsar
说私域14 小时前
基于多模态AI技术的传统行业智能化升级路径研究——以开源AI大模型、AI智能名片与S2B2C商城小程序为例
人工智能·小程序·开源