xukou-ticket-wx/App.vue

<script>
	import { API } from './config/index.js'
	import { urlUtils } from './common/util.js'
	
	export default {
		onLaunch: function() {
			console.log('App Launch')
			// 判断环境
			// #ifdef H5
			// 判断是否是开发环境
			if (process.env.NODE_ENV === 'development') {
				console.log('开发环境，使用模拟登录')
				this.mockAccountLogin('songwz', 'Abcd1234')
			} else {
				this.wxH5AuthLogin()
			}
			
			// 配置全局微信分享
			this.setupGlobalWechatShare()
			// #endif
			
			// #ifdef MP-WEIXIN
			this.wxLogin()
			// #endif
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		},
		onLoad: function() {
			console.log('App Load')
		},
		methods: {
			wxLogin() {
				// const token = uni.getStorageSync('token')
				// if (token) {
				// 	console.log('本地已有 token，直接使用:', token)
				// 	return
				// }
				uni.login({
					provider: 'weixin',
					success: (loginRes) => {
						const code = loginRes.code
						console.log('微信登录成功，code:', code)
						// 上传 code 到服务器获取 token
						uni.request({
							url: API.LOGIN,
							method: 'POST',
							data: { code },
							success: (res) => {
								const result = res.data
								if (result.errcode === 0) {
									const token = result.data.access_token
									console.log('获取 token 成功:', token)
									uni.setStorageSync('token', token)
								} else {
									console.error('登录失败:', result.errmsg)
									// 可选：uni.showToast({ title: result.errmsg, icon: 'none' })
								}
							},
							fail: (err) => {
								console.error('获取 token 失败:', err)
							}
						})
					},
					fail: (err) => {
						console.error('微信登录失败:', err)
					}
				})
			},
			
			// 微信公众号授权登录
			wxAuthLogin() {
				uni.getUserProfile({
					desc: '用于完善用户资料',
					success: (profileRes) => {
						console.log('获取用户信息成功:', profileRes.userInfo)
						const userInfo = profileRes.userInfo
						
						// 存储用户信息到本地
						uni.setStorageSync('userInfo', userInfo)
						
						// 获取token
						const token = uni.getStorageSync('token')
						if (!token) {
							uni.showToast({
								title: '请先登录',
								icon: 'none'
							})
							return
						}
						
						// 上传用户信息到服务器
						uni.request({
							url: API.GET_USER_INFO,
							method: 'POST',
							data: { 
								token,
								userInfo
							},
							success: (res) => {
								console.log('上传用户信息成功:', res.data)
								uni.showToast({
									title: '授权成功',
									icon: 'success'
								})
							},
							fail: (err) => {
								console.error('上传用户信息失败:', err)
								uni.showToast({
									title: '授权失败',
									icon: 'none'
								})
							}
						})
					},
					fail: (err) => {
						console.error('获取用户信息失败:', err)
						uni.showToast({
							title: '获取用户信息失败',
							icon: 'none'
						})
					}
				})
			},
			
			// 微信公众号H5授权登录
			wxH5AuthLogin() {
				// 判断是否在微信客户端中打开
				const isWeixinBrowser = /MicroMessenger/i.test(navigator.userAgent)
				if (!isWeixinBrowser) {
					uni.showModal({
						title: '提示',
						content: '请在微信客户端中打开',
						showCancel: false
					})
					return
				}
				let link = window.location.href;
				if (/code=/.test(link) || link.indexOf("code") > -1) {
					let temp = decodeURIComponent((new RegExp('[?|&]' + 'code' + '=' + '([^&;]+?)(&|#|;|$)').exec(
						link) || [, ''])[1].replace(/\+/g, '%20')) || null;
					console.log("code",temp)

					// 上传 code 到服务器获取 token
					uni.request({
							url: API.WX_LOGIN,
							method: 'POST',
							data: { code: temp },
							success: (res) => {
								const result = res.data
								if (result.errcode === 0) {
									const token = result.data.access_token
									console.log('获取 token 成功:', token)
									uni.setStorageSync('token', token)
								} else {
									console.error('登录失败:', result.errmsg)
									uni.showToast({ title: result.errmsg, icon: 'none' })
								}
							},
							fail: (err) => {
								console.error('获取 token 失败:', err)
							}
						})
				}else{
					const appId = 'wxbf4862e929ab85b0'
					const currentUrl  = window.location.href
					const redirectUri = encodeURIComponent(currentUrl.replace(/#\//, ""));
					const scope = 'snsapi_userinfo'
					const state = 'STATE'
					console.log(redirectUri)
					const authUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appId}&redirect_uri=${redirectUri}&
					response_type=code&scope=${scope}&state=${state}#wechat_redirect`
					
					// 重定向到微信授权页面
					window.location.href = authUrl
				}
			},
			
			// 模拟微信登录（仅用于本地测试）
			mockAccountLogin(username, password) {
				uni.request({
					url: API.LOGIN_ACCOUNT,
					method: 'GET',
					data: { username, password },
					success: (res) => {
						console.log('mockAccountLogin', res)
						if (res.data && res.data.code) {
							// 用接口返回的 code 走后续流程
							// this.handleWxH5Login(res.data.code)
						} else if (res.data && res.data.data.access_token) {
							// 或者直接返回 token
							uni.setStorageSync('token', res.data.data.access_token)
							uni.showToast({ title: '登录成功', icon: 'success' })
						} else {
							uni.showToast({ title: '登录失败', icon: 'none' })
						}
					},
					fail: () => {
					uni.showToast({ title: '请求失败', icon: 'none' })
					}
				})
			},
			
			// 配置全局微信分享
			setupGlobalWechatShare() {
				// #ifdef H5
				const isWeixinBrowser = /MicroMessenger/i.test(navigator.userAgent)
				if (!isWeixinBrowser || typeof window === 'undefined' || !window.wx) {
					console.log('非微信环境或微信JS-SDK未加载，跳过分享配置')
					return
				}
				
				// 获取当前页面入口地址作为分享链接
				const currentUrl = window.location.href
				// 移除URL中的hash部分，只保留基础URL
				const baseUrl = currentUrl.split('#')[0]
				
				// 全局分享配置
				const shareConfig = {
					title: '胥口枢纽闸站公众号',
					desc: '主要功能为胥口闸站船只过闸预约、支付等功能',
					link: baseUrl,
					imgUrl: window.location.origin + '/static/icon_logo.png',
					type: 'link'
				}
				
				// 生成安全的分享链接
				let safeShareUrl = shareConfig.link;
				try {
					safeShareUrl = urlUtils.generateSafeShareUrl(shareConfig.link, {
						source: 'share',
						timestamp: Date.now()
					})
				} catch (error) {
					console.warn('生成安全分享链接时出错:', error)
					// 使用默认链接
					safeShareUrl = shareConfig.link
				}
				
				window.wx.ready(() => {
					console.log('微信JS-SDK准备就绪，配置全局分享')
					
					// 分享到朋友圈
					window.wx.onMenuShareTimeline({
						title: shareConfig.title,
						desc: shareConfig.desc,
						link: safeShareUrl,
						imgUrl: shareConfig.imgUrl,
						success: () => {
							console.log('分享到朋友圈成功')
							uni.showToast({ title: '分享到朋友圈成功', icon: 'success' })
						},
						cancel: () => {
							console.log('取消分享到朋友圈')
						}
					})
					
					// 分享给朋友
					window.wx.onMenuShareAppMessage({
						title: shareConfig.title,
						desc: shareConfig.desc,
						link: safeShareUrl,
						imgUrl: shareConfig.imgUrl,
						type: shareConfig.type,
						dataUrl: '',
						success: () => {
							console.log('分享给朋友成功')
							uni.showToast({ title: '分享给朋友成功', icon: 'success' })
						},
						cancel: () => {
							console.log('取消分享给朋友')
						}
					})
					
					// 分享到QQ
					window.wx.onMenuShareQQ({
						title: shareConfig.title,
						desc: shareConfig.desc,
						link: safeShareUrl,
						imgUrl: shareConfig.imgUrl,
						success: () => {
							console.log('分享到QQ成功')
							uni.showToast({ title: '分享到QQ成功', icon: 'success' })
						},
						cancel: () => {
							console.log('取消分享到QQ')
						}
					})
					
					// 分享到微博
					window.wx.onMenuShareWeibo({
						title: shareConfig.title,
						desc: shareConfig.desc,
						link: safeShareUrl,
						imgUrl: shareConfig.imgUrl,
						success: () => {
							console.log('分享到微博成功')
							uni.showToast({ title: '分享到微博成功', icon: 'success' })
						},
						cancel: () => {
							console.log('取消分享到微博')
						}
					})
					
					console.log('全局微信分享配置完成')
				})
				
				window.wx.error((res) => {
					console.error('微信JS-SDK配置失败:', res)
				})
				// #endif
			}
		}
	}
</script>

<style lang="scss">
	/*每个页面公共css */
	@import "uview-ui/index.scss";
</style>