H5公众号怎么获取openid

2018-11-01  本文已影响0人  Hsugar


最近在自己做h5公众号的项目,具体的步骤如下 :

1. 在公众号后台设置回调的域名,url 

  开发-接口权限-网页账号-用户授权获取用户基础信息中修改

切记切记,在公众号配置的appid必须一致,包括后台获取的openid接口需要的appid

2. 在地址栏输入 https://open.weixin.qq.com/connect/oauth2/authorize?appid=*******&redirect_uri=你回调的地址&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect

ps: 当时这一步走了很多弯路,以为是http请求,结果只用在地址栏输入以上地址就好,比如我是vue写的项目

写在mounted或者methods里(建议写在mounted)

输入完在微信打开后会请求授权,之后就会跳转到所填写的回调url。注意跳转的是线上地址,所以我开始也在苦恼😖怎么调试~~  不用担心,解决办法总是有的

有个调试插件Vconsole,我在vue的main.js里  !isDev && new Vconsole();

或者import:

```

import VConsole from 'vconsole/dist/vconsole.min.js'       //import vconsole

let vConsole = new VConsole()         // 初始化

```

这样,跳转之后就可以看到返回里什么 ha ha 。可以在线调试了。会看到返回了code

3. 根据code获取到网页授权access_token(此token不是基础服务里的access_token,请记得区分),返回值内就含有openId。 不过我们是将code参数传过去调取后端getopenid这个接口,返回openId。具体看后端怎么获取了

4. 根据openId就可以获取用户基本信息了。 openId存在本地缓存,这样不用每次都需要授权,如果存在openId就直接进入公众号~

以上的就是我的经验跟注意细节啦~希望能帮到大家 

㊗️大家 万圣节 🎃 快乐 ……(^_^)

上一篇下一篇

猜你喜欢

热点阅读