使用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 => {} //失敗
		});
	}
});