微信网页授权，拿到用户code

用微信登录测试公众号平台

地址：微信公众平台

用微信扫描二维码关注测试公众号
修改网页授权获取用户基本信息接口，如图：
修改OAuth2.0网页授权

注意：
不能有http:// 等协议头；

地址是项目的地址，开发时测试用的就是项目启动后那个页面的地址，上线后就是线上页面的地址，还要注意下面的回调的页面地址要在这个地址的域名下，

如；当前地址是10.88.32.55:8080，回调的地址就可以是http://10.88.32.55:8080/aa.html, http://10.88.32.55:8080/bb/cc.html 等

代码实现网页授权，拿到用户code

  const AppId = 'wx0d9cdf54debed1ce';  // 测试公众号平台的APPID，第1步那个链接里const { code = '' } = qs.parse(window.location.search); // 获取当前页面地址中的code参数的值const local = (window.location.href);  // 对当前地址用encodeURIComponent进行编码// 如果code是''，说明还没有授权，访问下面连接，用户同意授权，获取codeif (code === '') {window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${AppId}&redirect_uri=${local}&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect`;} else {this.weixinCode = code;  // 能拿到code，说明用户已同意授权，拿到coedconsole.log('获取微信code：', this.weixinCode);}

参考链接：参考

注：redirect_uri等于的这个参数是授权后回调的页面地址，这个回调后的地址，必须要在AppId等于的这个测试公众号下设置的那个授权回调页面域名的域名下才行（上面3.4步）

本地测试时，AppId设置成自己的微信申请的测试公众号AppId，公众号上面设置的地址是（10.88.32.55:8080），这个时候，第一次访问当前页面（http：//10.88.32.55:8080），由于没有code，先去访问https://open.weixin.qq.com/connect/oauth2/authorize?appid=${AppId} &redirect_uri=${local}&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect这个页面拿到code，回调的是当前页面地址，即http：//10.88.32.55:8080，在设置的授权回调页面域名的域名下，所以不会报 “redirect_uri参数错误”的错

同理，上线时，AppId需要换成上线的那个AppId，这里的回调地址是进入页面的当前地址，但这时的地址不再是开发时本地测试的那个地址了，所以需要在上线的那个AppId的公众平台上重新设置授权回调页面域名，保证回调的地址在这个设置的这个地址域名下，就不会报错了

如：当忘记改AppId，此时还是在用自己本地开发测试时的AppId（设置的授权回调页面域名还是10.88.32.55:8080），但是上线了，上线后回调的地址不再是http：//10.88.32.55:8080，而是上线后的地址，此时这个地址已经不在10.88.32.55:8080域名下了，所以就会报“redirect_uri参数错误”的错

这里可能有点绕，如果是下次看到，记得多读两次，始终注意这一句话redirect_uri等于的回调地址，要在代码中设置的 Appid这个公众号中设置的授权回调页面域名的域名下

附：

做web前端开发写微信浏览器上浏览的页面时，很多时候会要求只能在微信端访问页面，
或者比如说访问上面的获取code的这个链接（这个链接只能在微信端访问，在其他浏览器上访问会提示用户在微信端访问而不是打开访问的页面）

这种情况下，开发时就没法用PC端的浏览器来调试了，如何做到能在PC端调试页面，这时就可以使用微信web开发者工具来调试，在PC端模拟微信访问

下载地址：微信web开发者工具

本地开发测试时，第5步的Appid用的是谁的微信号申请的测试公众号Appid，登录微信web开发者工具就用这个的微信号登录，不然会报错，错误提示好像是“未关注该测试号”，好像是这个

如果是只是调试公众号的页面，最好下载微信web开发者工具，而不是微信开发者工具，虽然微信开发者工具还能调试小程序等，但是用它来调试公众号页面，点击页面时是错位的，根本没法用，如果即想调试公众号页面，又要调试小程序，还是用微信开发者工具吧

下载地址：微信开发者工具

一个折中的办法：用微信开发者工具想要调试公众号的一些页面，有些不要求只能在微信上访问的页面，可以点击在浏览器上访问，然后在本地的浏览器上进行调试

微信网页授权，拿到用户code相关推荐

微信公众号开发__微信网页授权并获取用户基本信息（是否关注公众号、头像、昵称等）
本人最近要做微信公众号网页开发的项目,其中有个需求是判断用户是否关注公众号,由于之前没有接触过微信授权的东西,所以提前开始做调研.在度娘上看了好多博客.百度知道.百度经验.知乎问答等,还仔细阅读了微信 ...
Java微信公众号开发微信网页授权之前端传递code方式获取用户信息
本片博客讲解的网页授权分为两步,前端先传递backUrl(回调地址)到后台网页授权接口,该接口拿到回调地址后组装授权连接,重定向到前端页面,前端页面截取Code,传入后端获取用户信息方法,获取用户信息 ...
微信网页授权并获取用户信息
介绍在很多微信H5应用里,当用户访问第三方应用时就需要进行微信网页授权,并且很多涉及安全的操作我们必须要先获取用户信息才能继续,本文章简单介绍了微信授权流程,并通过申请微信测试账号来模拟网页授权,用 ...
Spring Boot 微信-网页授权获取用户信息
微信-验证服务器有效性微信-网页授权获取用户信息网页授权获取用户信息步骤第一步:用户同意授权,获取code 第二步:通过code换取网页授权access_token 第三步:拉取用户信息(需sc ...
连小白都能看懂的微信开发之微信网页授权 + 获取微信用户信息
微信网页授权所谓的微信网页授权说白了就是用户微信客户端内访问第三方网页,公众号可以根据网页授权这个机制来获取用户的基本信息,然后进行相应的逻辑处理. 官方文档 : https://mp.weixi ...
微信网页授权报错{errcode:40029,errmsg:invalid code}
原因:前端开发在重定向链接上拿code时将code处理成小写了因为微信网页授权涉及到用户的私密信息,所以会特别严格,区分大小写也是正规操作. 我们写的h5网页现在微信里获得用户权限,就需要走微信的微 ...
java配置微信网页授权_玩玩微信公众号Java版之六：微信网页授权
配置好了,就可以进行开发了,首先来看一下具体的流程: 其实很多功能点,前面已经实现过,只用改一下调用地址和参数即可. 首先,调用的定义链接:https://open.weixin.qq.com/con ...
解决vue路由hash模式下,微信网页授权问题
解决vue路由hash模式下,微信网页授权问题本人开发负责微信公众号端,菜单都是自定义菜单,然后每个菜单路径都是经过授权如:http://xxxx.com/ceshi/wechat/authoriz ...
微信公众号03 微信网页授权
前提准备域名开发微信网页授权时需要一个外网可以访问的域名,因为用户确认进行微信网页授权后微信服务器会通过一个回调URL向开发服务器发送一个回调请求. 开发阶段可以使用一些内网穿透工具来实现,例如: ...
微信网页授权，获取微信code，获取access_tocken,获取用户信息
微信开发中,经常有这样的需求:获得用户头像.绑定微信号给用户发信息.. 那么实现这些的前提就是授权! 1.配置安全回调域名: 在微信公众号请求用户网页授权之前,开发者需要先到公众平台官网中的" ...

微信网页授权，拿到用户code

微信网页授权，拿到用户code相关推荐

最新文章

热门文章