本文作者:DurkBlue

uniapp公众号获取微信code,静默授权与非静默授权

DurkBlue 2022-07-23 26224
uniapp公众号获取微信code,静默授权与非静默授权摘要: 如果用户在微信客户端中访问第三方网页,公众号可以通过微信网页授权机制,来获取用户基本信息,进而实现业务逻辑。网页授权微信官方文档:网页授权 | 微信开放文档 uniapp...

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

网页授权微信官方文档:网页授权 | 微信开放文档

 uniapp的h5页面放置微信公众号内,属于微信的内置浏览器,可以通过网页授权获取微信code。

由微信官方文档可知,微信的授权方式分为静默授权非静默授权

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

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

需要注意的是,这里静默授权和非静默授权 获取的都是 code 信息,只不过获取的code在后端解析的时候获取的信息是不同的。

前端获取微信code主要需要两个条件,一是微信公众号接入应用的appid,另一个是微信公众号配置的授权域名回调,在微信公众号-公众号设置-功能设置中的授权域名设置中进行设置,前端主要是通过跳转到微信官方发地址获取code信息,然后跳转到配置的授权回调域名,code信息就在回调地址栏上,通过自定义方法获取即可,前端主要代码如下:

getWechatCode() {

//回掉域名地址,一般由后端人员配置
			const local = ''; //自行填写 回调域名

//跳转至微信官方进行获取code,地址中需要填写appid
			window.location.href =
				'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' +
				'' //自行填写 appid
				'&redirect_uri=' +
				encodeURIComponent(local) +
				'&response_type=code&scope=snsapi_base&state=1#wechat_redirect';
		},
//链接地址中的appid需要填写微信公众号接入的应用appid
//scopde是设置授权的方式,这里是配置静默授权还是非静默授权

//获取回调地址栏上的code信息
	getUrlParam(name) {
			var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
			let url = window.location.href.split('#')[0];
			let search = url.split('?')[1];
			console.log(search);
			if (search) {
				var r = search.substr(0).match(reg);
				if (r !== null) {
					return unescape(r[2]);
				}
				return null;
			} else return null;
		},

以上就是前端获取code进行的全部操作。

特别注意的是:

     1、 code信息在后端进行处理的时候只能使用一次,这就意味着调用一次接口就需要重新获取一次code信息

     2、配置授权回调域名,在这个域名下的所有页面的地址都能获取到code信息,这就意味着A页面你获取的code,你如果跳转到B页面,B页面的地址栏也还是A页面的Code,如果想在B页面调用接口,需要在B页面重新获取code,否则后端解析会显示code已被使用。


此篇文章由DurkBlue博客申请发布,转载吧请注明来处
文章投稿或转载声明

来源:DurkBlue版权归原作者所有,转载请保留出处。本站文章发布于 2022-07-23
温馨提示:文章内容系作者个人观点,不代表DurkBlue博客对其观点赞同或支持。

赞(0)

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

支付宝扫一扫打赏

微信扫一扫打赏

阅读
分享