头像昵称弹窗弹出条件：button授权按钮 + uni.getUserProfile API请求

简单唤醒示范案例：

1.H5部分

<text class="loginsubmitbox-text"  v-on:tap="wechatLogin">微信一键登录</text>

2.JS部分

wechatLogin(){
	// 获取用户信息
	uni.getUserProfile({
		desc: '获取你的昵称、头像、地区及性别',
		success: res => {
			console.log(res);
			console.log(1);
		},
		fail: res => {
			console.log(2);
			console.log(res)
			//拒绝授权
			uni.showToast({
				title: '您拒绝了请求,不能正常使用小程序',
				icon: 'error',
				duration: 2000
			});
			return;
		}
	});
}

注意事项：

不能嵌入其他API内调用，一定要在调用的方法中第一层执行（优先执行uni.getUserProfile）

正确做法：必须第一步用户点击按钮，第二步调取uni.getUserProfile API（调取uni.getUserProfile操作与用户操作紧密联系）

错误做法：第一步用户点击按钮，第二步调uni.checkSession ，第三步才调取uni.getUserProfile API（中间隔着其他操作会导致调取uni.getUserProfile API授权弹窗失败）

实战应用中的授权登录示范案例：

1.错误写法：（两点错误：1.uni.checkSession中嵌入uni.getUserProfile会导致头像授权弹窗拉不起来；2.uni.login应该在uni.getUserProfile之前执行，否则会导致秘钥和密文不匹配从而解密失败）

wechatLogin() {
	//检查登录态是否过期
	uni.checkSession({
		provider: 'weixin',
		success: function(loginRes) {
			console.log('checkSession成功', loginRes);
		},
		fail: function(loginRes) {
			console.log('checkSession失败', loginRes);
			// 获取用户信息
			uni.getUserProfile({
				desc: '获取你的昵称、头像、地区及性别',
				success: res => {
					console.log('获取你的昵称、头像', res);
					//重新登录
					uni.login({
						provider: 'weixin',
						success: function(loginRes) {
							console.log('login重新登录', loginRes);
							// 登录请求
							// api.apiPost("/api/member/wechatappauth", {
							// 	jscode: loginRes.code,
							// }, (res) => {
							// 	console.log(res)
							// 	if (res.code == 0) {
							// 	} else {
							// 		uni.showModal({
							// 			title: '提示',
							// 			content: res.msg,
							// 		});
							// 	}
							// })
						},
						fail: function(loginRes) {
							console.log(loginRes)
						}
					});
				},
				fail: res => {
					console.log(2);
					console.log(res)
					//拒绝授权
					uni.showToast({
						title: '您拒绝了请求,不能正常使用小程序',
						icon: 'error',
						duration: 2000
					});
					return;
				}
			});
		},
	});
}

2.正确写法：（uni.getUserProfile在最外层直接调用，这样就成功唤醒授权弹窗；且uni.login要比uni.getUserProfile先执行）

wechatLogin() {
	//检查登录态是否过期
	uni.checkSession({
		provider: 'weixin',
		success: function(loginRes) {
			console.log('checkSession成功',loginRes);
		},
		fail: function(loginRes) {
			console.log('checkSession失败',loginRes);
		},
	});
	
	//重新登录
	let jsCode = ''
	uni.login({
		provider: 'weixin',
		success: function(loginRes) {
			jsCode = loginRes.code;
			console.log('login重新登录',{
				jscode: loginRes.code,
				jscodeinfo:res
			});
		},
		fail: function(loginRes) {
			console.log(loginRes)
		}
	});
	
	// 获取用户信息
	uni.getUserProfile({
		desc: '获取你的昵称、头像、地区及性别',
		success: res => {
			console.log('获取你的昵称、头像',res);
			// 登录请求
			// api.apiPost("/api/member/wechatappauth", {
			// 	jscode: jsCode,
			// 	jscodeinfo:res
			// }, (res1) => {
			// 	console.log(res1)
			// 	if (res1.code == 0) {
			// 	} else {
			// 		uni.showModal({
			// 			title: '登录失败',
			// 			content: '请刷新小程序后重新操作',
			// 		});
			// 	}
			// })
		},
		fail: res => {
			console.log(2);
			console.log(res)
			//拒绝授权
			uni.showToast({
				title: '您拒绝了请求,不能正常使用小程序',
				icon: 'error',
				duration: 2000
			});
			return;
		}
	});
}

注意事项：

服务端用户信息解密失败原因：小程序客户端调用微信服务器的接口顺序反了。

 顺序应该是  1、wx.login    2、wx.getUserInfo 。 
如果顺序反过来 ，会出现校验解密失败的问题，比较坑的是 不是每次都出错。

小程序客户端需要调用微信服务器的wx.login接口来获取code，然后调用wx.getUserInfo来获取加密数据和偏移向量iv。正确的顺序应该是先调用login，然后再调用getUserInfo。