使用uni-app获取微信小程序openid(同理小程序) -- 详解

博客: 使用uni-app进行小程序的受权登陆(获取用户头像,名称,性别,地区等)

介绍openid

微信开发时, 用户使用小程序须要受权, 这时就要用到openid进行绑定这个用户。 openid是微信用户在公众号appid下的惟一用户标识（appid不一样，则获取到的openid就不一样），可用于永久标记一个用户，同时也是微信JSAPI支付的必传参数。

1. 为何要使用openid呢？

openid是指这个用户在某一个小程序中受权后的惟一标识(好比你的身份证)

2. 若是不使用会带来什么问题呢？

第一次受权时将用户数据保存到数据库, 而后用户把缓存清理了, 第二次受权的时候咱们就没法知道这个用户是否受权过。用户就会从新保存一份新的数据进数据库。这是不符合正常逻辑的，由于若是该用户买过东西，再次受权，东西都看不到了，会像新的号同样。固然了， 有的设计是有本身的记录方式的，好比须要注册登陆。

3. openid如何获取？

须要用到wx指定的接口

注意：

注意：通常都是将code值传到后端去获取openid，由于在前端可能会被抓包或爬取到你的appid和secret，不安全，若是放在后端获取openid，除非你的服务器被攻击了，否则就是安全的。下面的实例是在前端直接获取的，这个明白后，能够直接改为后端的，是逻辑同样的。

步骤一：获取code值

经过uni.login()接口（同理wx.login）, 拿到用户的code值(5分钟后失效)。

代码：

//漫路h
uni.login({
	success: res => {
		//code值(5分钟失效)
		console.info(res.code);
	}
});

步骤二：获取openid

经过小程序的appid和secret和步骤一获取到的code值向wx指定的接口发送请求，便会返回openid（每一个小程序惟一的）

代码：

//漫路h
uni.login({
	success: res => {
		//code值(5分钟失效)
		console.info(res.code);
		//小程序appid
		let appid = 'wx3599fe368a452c9'; //我瞎写的
		//小程序secret
		let secret = '1a5567978saf65c43s8s2397er1332ce'; //我瞎写的
		//wx接口路径
		let url = 'https://api.weixin.qq.com/sns/jscode2session?appid=' + appid + '&secret=' + secret + '&js_code=' + res.code + '&grant_type=authorization_code';
		uni.request({
			url: url, // 请求路径
			data: {}, // 请求体  注:在这里不须要写,有没有无所谓
			method: 'GET', //请求方式,
			header: '', //请求头  注:在这里不须要写,有没有无所谓
			success: result => {
				//响应成功
				//这里就获取到了openid了
				console.info(result.data.openid);
				uni.setStorage({
					key:'user',
					data: result.data.openid
				})
			},
			fail: err => {} //失败
		});
	}
});