uniapp实现多平台登录和第三方微信登录

1.微信小程序登录

// #ifdef MP-WEIXIN
					uni.login({
						provider: 'weixin',
						success: function(wxres) {
							data.raw = JSON.stringify(wxres);
							that.logins(data)
							console.log('wx');
						}
					})
					// #endif

先使用uni.login这个api获取openID

2.在请求后台的接口

logins(data) {
				console.log('登录');
				this.$Ruquest('get', data).then(res => {
					console.log(res);
					const {
						data: {
							data,
							errmsg
						}
					} = res;
					if ('成功' === errmsg) {
						uni.$u.toast('登陆成功！')
						uni.setStorageSync("token", data.accessToken);
						uni.setStorageSync("user", data);
						uni.switchTab({
							url: '/pages/index/index'
						});
					} else {
						uni.$u.toast(errmsg)
					}

				})
			},

如果是App和h5端，就直接调用这个后台接口就可以了

三.微信登录功能

	//第三方登录
			thirdParty() {
				//wxb230ba20ae7426c8
				// #ifdef  H5
				this.webH5Login()
				// #endif
				// #ifdef APP-PLUS
				this.webAppLogin()
				// #endif
				// #ifdef MP-WEIXIN
				/** 小程序第三方微信授权登陆*/
				this.MPLogin()
				// #endif
			},

01.App微信登录

//手机App第三方登录
			webAppLogin() {
				console.log('webAppLogin');
				let that = this;
				uni.login({
					provider: 'weixin',
					success: function(wxres) {
						that.$Ruquest('POST', {
							_gp: 'user',
							_mt: 'thirdPartLogin',
							loginType: 2,
							raw: JSON.stringify(wxres)
						}).then(res => {
							console.log(res);
							const {
								data: {
									data,
									errmsg
								}
							} = res;
							if ('成功' === errmsg) {
								uni.$u.toast('登陆成功！')
								uni.setStorageSync("token", data.accessToken);
								uni.setStorageSync("user", data);
								uni.switchTab({
									url: '/pages/index/index'
								});
							} else {
								uni.$u.toast(errmsg)
							}

						})
						
					}
				})

			},

02.小程序微信登录

// 微信小程序第三方登录
			MPLogin() {
				console.log('MPLogin');
				let that = this;
				uni.login({
					provider: 'weixin',
					success: function(wxres) {
						that.$Ruquest('POST', {
							_gp: 'user',
							_mt: 'thirdPartLogin',
							loginType: 1,
							raw: JSON.stringify(wxres)
						}).then(res => {
							console.log(res);
							const {
								data: {
									data,
									errmsg
								}
							} = res;
							if ('成功' === errmsg) {
								uni.$u.toast('登陆成功！')
								uni.setStorageSync("token", data.accessToken);
								uni.setStorageSync("user", data);
								uni.switchTab({
									url: '/pages/index/index'
								});
							} else {
								uni.$u.toast(errmsg)
							}

						})
					}
				})
			},

03.微信公众号H5端登录，就是微信内置的网页，需要先在微信公众平台配置，然后再微信开发者工具另外打开一个公众号，关注这个公众号

//微信公众号h5
import {
		WX_AppID,//微信小程序ID
		CALL_URL //重定向的页面
	} from '@/config/index.js'


			webH5Login() {
				console.log('webH5Login');
				const BACKURL = encodeURIComponent(CALL_URL);
				const url =
					"https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + WX_AppID +
					"&redirect_uri=" + BACKURL + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect";
				window.location.href = url;
			},

 重定向到这个界面就会向后台发起请求

onLoad() {
			const that = this;
			const code = this.getUrlCode("code");
			console.log(code);
			that.$Ruquest('post', {
				"_gp": 'user',
				"_mt": 'thirdPartLogin',
				loginType: 3,
				raw: code
			}).then(res => {
				console.log(res);
				let data = res.data;
				if ('成功' === data.errmsg) {
					uni.$u.toast('登陆成功！')
					uni.setStorageSync("user", data.data)
					uni.setStorageSync("token", data.data.accessToken)
					uni.switchTab({
						url: '/pages/index/index'
					});
				} else {
					uni.$u.toast(data.errmsg)
				}

			})

 这个code值会在路径中传过来，所以需要截取出来，在onLoad生命周期函数里是拿不到的

methods: {
			//截取地址栏code
			getUrlCode(name) {
				return (
					decodeURIComponent(
						(new RegExp("[?|&]" + name + "=" + "([^&;]+?)(&|#|;|$)").exec(
							location.href
						) || [, ""])[1].replace(/\+/g, "%20")
					) || null
				);
			},
		}

完结