h5 微信授权获取微信code值

微信授权流程：先获取微信code值，再让后端通过code值去微信拿个人信息，然后通过个人信息里的openid来进行绑定
也解决了code 40163问题重复使用的问题

<view class="pick pick_line">
	<view class="left">
		<view class="pic">
			<image :src="wxImgPath" mode="aspectFill"></image>
		</view>
		<view class="title">
			微信
		</view>
	</view>
	<view class="right">
		<view class="tip tip_black" @tap="ispop = true" v-if="userInfo.is_wechat==1">
			已绑定
		</view>
		<view @tap="Auth(1)" class="tip" v-else>
			未绑定
		</view>

		<view class="right_icon">
			<image src="/static/icons/set_right.png" mode=""></image>
		</view>
	</view>
</view>

data() {
	return {
		code:'',//微信code
		openid:'',//当前程序唯一标识
	}
},
onLoad(option) {
	this.getIsAuth();
},
onUnload(){
	this.$cache.remove('securityUrl');
},
methods: {
	//查看url是否有参数,有参数就说明是授权后回调打开的页面
	getIsAuth(){
		let u = location.href;//拿取当前url
		let a = u.split('?');//将url截开
		
		var aa = this.$cache.get('securityUrl');//看缓存有没有当前页的url
		
		//根据url后面是不是有参数来判断是否有获得微信code值
		if(a.length >= 2){
			if(!aa){
				//将当前url存储,因为去微信授权拿code再返回来页面的路径会变
				this.$cache.put('securityUrl', a[0]);//将当前页的url存储，携带的参数不要
			}
			let c = a[1].split('&')
			let d = c[0].split('=')[1];//微信code值
			this.code = d;
			this.getAccess(1);
		}else{
			if(!aa){
				//将当前url存储,因为去微信授权拿code再返回来页面的路径会变
				this.$cache.put('securityUrl', u);//将当前url存储
			}
		}
	},
	//解绑第三方授权
	unbindThirdAuth(num) {
		//封装的请求
		this.$request.unbindThirdAuth(obj,this)
		.then(res =>{
			if(res.code == 0){
				if(num == 1){
					this.code = '',//微信code
					this.openid = '',//当前程序唯一标识	
				}
				uni.showToast({
					title:'解绑成功',
					icon:'success',
					duration:1500
				})
			}else{
				uni.showToast({
					title:res.message,
					icon:'none',
					duration:2000
				})
			}
		})
		.catch(res =>{
			uni.showToast({
				title:res.message,
				icon:'none',
				duration:2000
			})
		})
	},
	/**
	 * 获取url中code
	 */
	Auth(num) {
		//微信绑定授权
		if(num == 1){
			// 判断浏览器类型
			let isWeChat = this.$func.isWeChat()
			this.isWeChat = isWeChat
			if (!isWeChat) {
				uni.showToast({
					title:'请用微信浏览器打开再授权',
					icon:'none',
					duration:2000
				})
				return;
			}
			this.sendCode() // 获取code，每绑定一次都要拿新的code，不能重复利用
		}
	},
	/**
	 * 跳转微信用户授权页
	 * 用户同意就会打开redirect_uri后拼接的链接页面，并且携带着code值和state数据
	 */
	sendCode() {
		var nowUrl; 
		var u = this.$cache.get('securityUrl');//从缓存里拿到当前页的url，且URL后面没有携带参数的
		if(!u){
			nowUrl = location.href;
		}else{
			nowUrl = u;
		}
		let link = encodeURIComponent(nowUrl);//编码
		let appid = getApp().globalData.wxAppid;//微信支付公众号id
		//跳转微信授权页并获取code，然后他会通过redirect_rui来重新跳回你指定的页面
		let url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appid + '&redirect_uri=' + link +
			'&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect'
		location.href = url;
	},
	/**
	 * 通过code获取access_token
	 */
	getAccess(num) {
		let data = {
			code: this.code,
		}
	
		//将code给后端，通过接口拿取用户信息
		this.$request.userOuth(data, this)
			.then(res => {
				if(res.code == 0){
					this.authObj = res.data;
					if(num == 1){
						this.openid = res.data.openid;
						this.bindThirdAuth(1);
					}
				}else{
					uni.showToast({
						title:res.message,
						icon:'none',
						duration:2000
					})
				}
			})
			.catch((error) => {
				uni.showToast({
					title:error.message,
					icon:'none',
					duration:2000
				})
			})
	},
	//用户微信绑定账号
	bindThirdAuth(num){
		//封装的请求
		this.$request.bindThirdAuth(obj,this)
		.then(res =>{
			if(res.code == 0){
				uni.showToast({
					title:'绑定成功',
					icon:'success',
					duration:1500
				})
			}else{
				uni.showToast({
					title:res.message,
					icon:'none',
					duration:2000
				})
			}
		})
		.catch(res =>{
			uni.showToast({
				title:res.message,
				icon:'none',
				duration:2000
			})
		})
	}
	}