小程序

微信自定义菜单+获取网页授权+获取用户信息

2019-03-01  本文已影响426人  喊我小王吧

微信自定义菜单+获取网页授权+获取用户信息

今天项目需要一个需求,就是添加一个菜单接口,并且还可以获取用于的信息,从而根据用户的信息去做一些业务的查询。通过百度和自己查看文档大致的解决办法如下:

注意

在自定义自己菜单前,若跳转自己服务器里面的url时候,首先得设置自己点击菜单时的回调域名
image.png

不能以http或者https开头必须是www.xx.com类似于这样子的字符串形式

1 首先来自定义菜单创建接口

按照文档的要求一步一步来:

1.1 首选是自定义接口的一些限制和说明,这里就不多说了,看文档就可以明白。

这直接看文档即可 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141013

1.2 然后是发送接口请求,自定义自己的菜单。

接口调用请求说明

http请求方式:POST(请使用https协议) https://api.weixin.qq.com/cgi-bin/menu/create?access_token=ACCESS_TOKEN

详情看文档即可,没什么好说的。发送请求和json即可。

本人的请求如下:

url : https://api.weixin.qq.com/cgi-bin/menu/create?access_token=19_7LGwU9xSYhQ5qLea2Vw3u0AtMePOXGY0KTqR6pNhH14oYoev8mGTuI3YzWtUBrTB_5MeBPDEkPtl52M-vCAvH9Z8w2ZPmkHzW-ymKyzLU5YF0Z-aasorSC34xSH2bVG0XYAv8aeVVb0VyE4cPDAgAHAHVS

json数据

{
    "menu": {
        "button": [
            {
                "type": "scancode_push",
                "name": "扫码",
                "key": "rselfmenu_0_1",
                "sub_button": []
            },
            {
                "type": "view",
                "name": "我的发票记录",
                "url": "http://www.udeam.com/cc",
                "sub_button": []
            }
        ]
    }
}

注意:

不要直接复制官网的json数据,应当去掉 "menu": 这一层json , 可能会出现 以下错误:

{
    "errcode": 40016,
    "errmsg": "invalid button size hint: [hTpqGa02101977]"
}

成功返回: {"errcode":0,"errmsg":"ok"}

错误时的返回JSON数据包如下(示例为无效菜单名长度): {"errcode":40018,"errmsg":"invalid button name size"} 或者其他错误等。

2 自定义菜单查询接口

请求说明

http请求方式:GET
https://api.weixin.qq.com/cgi-bin/menu/get?access_token=ACCESS_TOKEN

返回说明(无个性化菜单时)

在这里插入图片描述

菜单界面

在这里插入图片描述

3 自定义菜单删除接口

https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141015

4 controller

@GetMapping("cc")
public String cc(HttpServletRequest request) throws IOException {
 return "suceess"; //我自己的页面
}

启动运行

success 页面

但是我们这样子仅仅只是单独的挑了个页面无法获取到用户的一些信息,如debug所示!

无法获取到code所以,在跳转第三方网页的时候需要授权后才能获取到用户的一些基本信息。
** 获取用户信息的前提是网页授权这里没有进行网页授权,从而获取code值也为null**


在这里插入图片描述

5 微信网页授权

利用微信网页授权机制来进行重定向到自定义的一个url

如果用户在微信客户端中访问第三方网页,公众号可以通过微信网页授权机制,来获取用户基本信息,进而实现业务逻辑。

**关于网页授权回调域名的说明**

1、在微信公众号请求用户网页授权之前,开发者需要先到公众平台官网中的“开发 - 接口权限 - 网页服务 - 网页帐号 - 网页授权获取用户基本信息”的配置选项中,修改授权回调域名。请注意,这里填写的是域名(是一个字符串),而不是URL,因此请勿加 http:// 等协议头;

2、授权回调域名配置规范为全域名,比如需要网页授权的域名为:www.qq.com,配置以后此域名下面的页面<http://www.qq.com/music.html> 、 <http://www.qq.com/login.html> 都可以进行OAuth2.0鉴权。但[http://pay.qq.com](http://pay.qq.com/) 、 [http://music.qq.com](http://music.qq.com/) 、 [http://qq.com无法进行OAuth2.0鉴权](http://qq.xn--comoauth2-735sh62dwk9eysua.xn--0-k76bu98j/)

3、如果公众号登录授权给了第三方开发者来进行管理,则不必做任何设置,由第三方代替公众号实现网页授权即可

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

1、以snsapi_base为scope发起的网页授权,是用来获取进入页面的用户的openid的,并且是静默授权并自动跳转到回调页的。用户感知的就是直接进入了回调页(往往是业务页面)

2、以snsapi_userinfo为scope发起的网页授权,是用来获取用户的基本信息的。但这种授权需要用户手动同意,并且由于用户同意过,所以无须关注,就可在授权后获取该用户的基本信息。

3、用户管理类接口中的“获取用户基本信息接口”,是在用户和公众号产生消息交互或关注后事件推送后,才能根据用户OpenID来获取用户基本信息。这个接口,包括其他微信接口,都是需要该用户(即openid)关注了公众号后,才能调用成功的。

然后根据自己的场景选择授权并且获取用户的信息

关于特殊场景下的静默授权

1、上面已经提到,对于以snsapi_base为scope的网页授权,就静默授权的,用户无感知;

2、对于已关注公众号的用户,如果用户从公众号的会话或者自定义菜单进入本公众号的网页授权页,即使是scope为snsapi_userinfo,也是静默授权,用户无感知。

具体而言,网页授权流程分为四步:

1、引导用户进入授权页面同意授权,获取code

2、通过code换取网页授权access_token(与基础支持中的access_token不同)

3、如果需要,开发者可以刷新网页授权access_token,避免过期

4、通过网页授权access_token和openid获取用户基本信息(支持UnionID机制)

具体代码以及步骤如下:

第一步

点击菜单的url直接重定向到下面这个url即可,目的 “引导用户进入授权页面同意授权,获取code ”

https://open.weixin.qq.com/connect/oauth2/authorize?appid= + “自己的appid” + &redirect_uri= +“ 自己的url ”+ &response_type=code&scope=snsapi_base&state=1#wechat_redirect"

@GetMapping("cc")
public String cc(HttpServletRequest request) throws IOException {

    String code = request.getParameter("code");

    return "redirect:/https://open.weixin.qq.com/connect/oauth2/authorize?appid=xxxxx&redirect_uri=http://www.xxx.com/aaa&response_type=code&scope=snsapi_base&state=1#wechat_redirect";

}


第二步

获取到code之后,就可以根据获取用户信息(这里详细见微信网页授权四步骤文档)
然后在controller 根据自己的需求执行其他逻辑。

@GetMapping("aaa")//重定向的url 也就是上面controller重定向的微信url里面重定向自己的url(http://www.xxx.com/aaa)
public String aa(HttpServletRequest request) throws IOException {
    String code = request.getParameter("code");
    return "success";
}

debug 结果

在这里插入图片描述

第三步

获取到授权后code,然后可以根据 网页授权(https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842)第2.3.4步步骤获取用户的信息,从而自己的实现业务逻辑。

注:

另外看到网上一部分大佬们直接将 将链接的url直接作为微信自定义菜单中view类型中的url  中。

结果我在postman中发了一次请求,直接报url长度错误,所以放弃了这种方案!
在这里插入图片描述
上一篇下一篇

猜你喜欢

热点阅读