Taro:微信小程序通过获取手机号实现一键登录

这篇具有很好参考价值的文章主要介绍了Taro:微信小程序通过获取手机号实现一键登录。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

        本文介绍如果通过微信小程序的getPhoneNumber方法获取用户微信绑定的手机号并自动注册登录。

1、前端获取手机号

<template>
    <nut-button size="large" block color="#1890FF" :loading="loading"  openType="getPhoneNumber" @getphonenumber="wxLogin">微信一键登录</nut-button>
</template>

1、按钮类型 openType 指定 "getPhoneNumber"  

2、@getphonenumber必须全部小写

// 微信一键登录事件
async function wxLogin(e) {       
    loading.value = true;
    try {
      const result = await wxNumberLogin({
        appid: getAppId(), // 微信小程序APPID
        code: e?.detail?.code,
        openId: openId.value, // 微信小程序openID  
      });
      if (isRespondSuccess(result)){
        const from_url = Taro.getCurrentInstance().router?.params["from_url"];
        if (from_url && (from_url !== 'undefined')){
          Taro.reLaunch({url: from_url});
        } else {
          Taro.switchTab({url: `${ROUTER_ENUM.PAGE_HOME}`});
        }
      }
    } finally {
      loading.value = false;
    }
}

code:手机号获取凭证:动态令牌。可通过动态令牌换取用户手机号。

2、后台自动注册账号

        后台根据前端传入的code获取手机号并自动将手机号注册为账号。

public CommonResult<UserToken> getPhoneNumberRegister(String code, String appid, RegisterParams params) {
    String urlGetPhoneNumber = WxPlatformConstants.CODE_GET_PHONENUMBER
            .replaceFirst("ACCESS_TOKEN", getAuthAccessToken(appid));
    Map<String, String> map = new HashMap<>();
    map.put("code", code);
    String result  = HttpUtil.doPostUseJsonParams(urlGetPhoneNumber, map, HttpCharset.UTF8);
    log.info("getPhoneNumber_result:" + result);
    JSONObject object = JSON.parseObject(result);
    JSONObject phoneObject = object.getJSONObject("phone_info");
    String phone = phoneObject.getString("phoneNumber");
    params.setMobile(phone);

    return sysUserService.register(params, false); // 不需要校验验证码
}

1、 常量参数CODE_GET_PHONENUMBER :

CODE_GET_PHONENUMBER = "https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=ACCESS_TOKEN";

2、微信返回的参数:

{
    "errcode":0,
    "errmsg":"ok",
    "phone_info": {
        "phoneNumber":"xxxxxx",
        "purePhoneNumber": "xxxxxx",
        "countryCode": 86,
        "watermark": {
            "timestamp": 1637744274,
            "appid": "xxxx"
        }
    }
}

 新时代农民工文章来源地址https://www.toymoban.com/news/detail-587073.html

到了这里,关于Taro:微信小程序通过获取手机号实现一键登录的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序:获取用户手机号(前端)

    获取手机号的开发过程可以分为三部分:微信前端设置,微信js文件编写,服务器端程序开发. 其中微信前端最为简单,在获取手机号的过程中我们必须经过用户授权,在wxml文件中加入如下代码: 然后我们需要编写js文件,当用户允许获取手机号后调用相关逻辑,将手机号加密信息发

    2024年02月06日
    浏览(40)
  • 企业微信小程序获取手机号?

    一、确定小程序是开发企业内部应用,还是开发第三方应用。  如果是开发企业内部应用,也就是应用自建的可以使用   wx.qy.getMobile 这个api 去获取手机号 wx.qy.getMobile 调用前提: 1、必须先调用过wx.qy.login,且session_key未过期,开发者可调用checkSession 检查当前登录态( 需要

    2024年02月07日
    浏览(30)
  • 新版微信小程序获取用户手机号

    小程序手机号验证组件有两种 手机号快速验证组件 手机号实时验证组件

    2024年02月11日
    浏览(35)
  • 微信小程序通过code获取手机号,提示:{errcode: 47001, errmsg: “data format error hint: [xxxxxx] rid: xxxxxx“}的解决办法

    微信小程序官方文档里, 需要用POST提交到: https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=ACCESS_TOKEN 请求参数是access_token和code  看文档后,会误认为要提交两个参数access_token和code,实际上只需要提交code就行。 提交的地址是:https://api.weixin.qq.com/wxa/business/getuserphonen

    2024年02月09日
    浏览(28)
  • 微信小程序手机号授权获取收费(手机号快速验证组件)剩余次数查看购买

    登录微信公众平台 ,在管理---》付费管理下查看,已用次数和剩余次数 该能力旨在帮助开发者向用户发起手机号申请,并且 必须经过用户同意后 ,开发者才可获得由平台验证后的手机号,进而为用户提供相应服务。 该能力与手机号实时验证组件的区别为: 手机号快速验证

    2024年02月22日
    浏览(46)
  • 微信小程序获取手机号登录(Java后端)

    1.前端请求getPhoneNumber方法获取code传给后端接口; 2.后端接口通过配置的appid、secretKey请求接口https://api.weixin.qq.com/cgi-bin/token获取access_token参数; 3.后端通过参数code和参数access_token,去请求接口https://api.weixin.qq.com/wxa/business/getuserphonenumber来获取手机号。

    2024年02月11日
    浏览(44)
  • 【微信小程序】如何获取用户手机号授权登录

    目前该接口针对非个人开发者,且完成了认证的小程序开放(不包含海外主体),也就是说只针对企业认证小程序开放。若用户举报较多或被发现在不必要场景下使用,微信有权永久回收该小程序的该接口权限。 在使用该接口时,用户可使用微信绑定手机号进行授权,也添加

    2024年02月16日
    浏览(49)
  • 微信小程序——获取用户手机号(Java后台)

    最后有完整代码 1、获取code 2、利用code获取sessionkey 小程序端: Java后台: 获取小程序密钥:微信公众平台-开发管理-开发设置 3、获取iv和encryptedData并解密获取手机号 java后台: 如果报错40029则可能是appid不对 4、完整代码 wxml: wxss: js: Java后台

    2024年02月12日
    浏览(35)
  • 微信小程序: java实现获取手机号方式

    目录 1. 现在比较简单的方式 - 接口名 --- 功能描述 - 调用方式 --- HTTPS 调用 --- 第三方调用 --- 请求参数 --- 返回参数 2. 实现方式 1. 加入fastjson依赖  2. http请求类 3. Json串工具类 4.接口方法 3.另外介绍一点access_token 微信官方文档介绍:  getPhoneNumber --- 功能描述 该接口需配合手机

    2024年02月16日
    浏览(49)
  • 微信小程序&会议OA-登录获取手机号流程&登录-小程序&导入微信小程序SDK(从微信小程序和会议OA登录获取手机号到登录小程序导入微信小程序SDK)

    目录 获取用户昵称头像和昵称 wx.getUserProfile bindgetuserinfo 登录过程 登录-小程序 wx.checkSession wx.login wx.request 后台 准备数据表 反向生成工具生成 准备封装前端传过来的数据 小程序服器配置 导入微信小程序SDK application.yml WxProperties WxConfig WxAuthController 登录-小程序 login.js user.j

    2024年02月04日
    浏览(34)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包