H5页面授权获取微信授权(openId,微信nickname等信息)

关于网页授权的两种scope的区别说明

1、以snsapi_base为scope发起的网页授权,是用来获取进入页面的用户的openid的,并且是静默授权并自动跳转到回调页的。用户感知的就是直接进入了回调页(往往是业务页面)
2、以snsapi_userinfo为scope发起的网页授权,是用来获取用户的基本信息的。但这种授权需要用户手动同意,并且由于用户同意过,所以无须关注,就可在授权后获取该用户的基本信息。

参考连接:

https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html

前端部分:

根据上述官方文档实现第一步,用户同意授权,获取code。

前端主动跳转到下面的连接地址,改地址会从微信服务器获取到code,这个code是后面换取token的凭证。
微信处理完后回跳转回调redirect_uri/?code=CODE&state=STATE。,这个url通常对应spring controller层的接口。

https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx73a924c42a171243&redirect_uri=http%3a%2f%2fbis.beyandtech.com%2fsales%2fwx%2fwxpreReg&response_type=code&scope=snsapi_userinfo&state=shba01,e2c028b7063f498ba3388ec0cb2e6bdf,0,0#wechat_redirect

后端接口收到微信服务器的回调请求,处理code和state参数。code作用是获取token进而获取用户信息,state可以用来定义其他参数(逗号可以分割多个参数,后端解析)

后端部分

授权过程一共四部,我们只是建议从第二部开始由后端完成。

接口获取并解析参数
    @GetMapping("/sales/wx/wxpreReg")
    public String wxpreReg( String code,String state)
    {
         logger.info("wxpreReg:code={},state={}",code,state);
         String arr[] = state.split(",");
     
         Long pathIda =  wxService.wxpreReg(code,arr[0],arr[1],arr[2], Long.valueOf(arr[3]));
         String parms= "parm1="+arr[0]+"&parm2="+arr[1]+"&parm3="+pathIda+"&oauth=1";
         return "redirect:https://xxx.xxxxxx.com/index.html/#/pages/login/login?"+parms;
    }
获取token,并获取用户信息
private static String ACCESSTOEKN_URL = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=xxxxx&secret=xxx&code=CODE&grant_type=authorization_code";
private static String USERINFO_URL = "https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN";
public  JSONObject getUserInfo(String code){
    String url = ACCESSTOEKN_URL.replaceAll("CODE",code);
    String jsonstr = restTemplate.getForObject(url,String.class);
    JSONObject jsonObject =JSONObject.parseObject(jsonstr);
    System.out.println(jsonstr);
    String url1 = USERINFO_URL.replaceAll("ACCESS_TOKEN",jsonObject.getString("access_token"))
            .replaceAll("OPENID",jsonObject.getString("openid"));
    String jsonstr1 = restTemplate.getForObject(url1,String.class);
    System.out.println(jsonstr1);

    return  JSONObject.parseObject(jsonstr1);
}

以上就完成了H5页面授权,获取用户信息,并且重定向页面到原来页面,附加参数oauth=1,前端识别后就可以判断是否授权了

  • 2
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uni微信h5静默授权是指在用户进入uni微信H5页面时,通过微信授权接口获取用户的openid,并且不弹出授权页面让用户手动授权的一种授权方式。 实现uni微信H5静默授权获取openid的步骤如下: 1. 首先,在uni-app中引入微信JSSDK,通过在index.html中引入微信JS SDK库文件,或者通过npm安装并在main.js中引入微信JSSDK。 2. 在uni微信H5页面中编写获取openid的逻辑。可以在页面加载完成后,通过微信JSSDK提供的接口wx.config进行微信JS SDK的配置。在配置完成后,可以通过调用wx.ready函数,在ready回调函数中进行获取openid的操作。 3. 使用uni.request或uni.get请求后端接口,将微信提供的code发送至后端。 4. 后端接口需要通过微信的网页授权接口,调用接口获取access_token和openid。接口调用成功后,可以把openid返回给前端。 5. 前端接收到openid后,可以进行后续的业务逻辑处理,例如用户登录、数据统计等。 需要注意的是,uni微信H5静默授权获取openid需要满足一定的条件,包括要求用户在微信客户端中已经授权过且未取消授权页面的域名需要与微信公众平台的配置一致等。 总结起来,通过微信JSSDK的配置和调用微信的网页授权接口,可以实现uni微信H5静默授权获取openid的功能。这使得开发者能够更加便捷地获取用户的openid,并基于openid实现个性化的功能和服务。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值