From 4d3be95b2d5c8597a9bd9fc436e51482023793a1 Mon Sep 17 00:00:00 2001 From: cwchen <1048842385@qq.com> Date: Wed, 28 Jan 2026 11:14:36 +0800 Subject: [PATCH] =?UTF-8?q?=E5=9C=B0=E5=9B=BE=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/projectSelect/index.vue | 10 ++--- src/static/map.html | 74 +++++++------------------------ 2 files changed, 21 insertions(+), 63 deletions(-) diff --git a/src/pages/projectSelect/index.vue b/src/pages/projectSelect/index.vue index 32b359a..ae533dd 100644 --- a/src/pages/projectSelect/index.vue +++ b/src/pages/projectSelect/index.vue @@ -112,18 +112,16 @@ const handleWebViewMessage = (event) => { token: memberStore.token, }, (result) => { - console.log("收到原生回调:", result); - // 增加非空判断 if (!result) return; - // 根据原生传回的 status 字段判断逻辑 if (result.status === 'closed') { console.log("监听到三维模型关闭"); - uni.$u.toast('三维模型已关闭'); + uni.$u.toast('模型已关闭'); // 在这里处理你需要的业务逻辑,比如刷新列表 - } - else if (result.status === 'success') { + }else if(result.status === 'opened'){ + uni.$u.toast('模型已开启'); + }else if (result.status === 'success') { // 处理保存成功的逻辑 } }, diff --git a/src/static/map.html b/src/static/map.html index 44adec7..6573834 100644 --- a/src/static/map.html +++ b/src/static/map.html @@ -589,9 +589,6 @@ } }; - /** - * 网络请求类 - */ const Network = { baseUrl: '/api', token: '', @@ -634,47 +631,33 @@ }); }, - /** - * 增强版网络检测:用心跳请求检测真实互联网连接 - * 解决热点有连接但无网络的问题 - */ checkInternetConnectivity() { return new Promise((resolve) => { - // 如果浏览器已经认为离线,直接返回 false if (!navigator.onLine) { resolve(false); return; } - - // 创建一个微小的请求来测试互联网 - // 使用 favicon.ico 或一个极小的静态资源,加上时间戳防缓存 - // 这里使用百度地图的一个极小图标,因为它本身就在白名单里,且速度快 const testImg = new Image(); - const timeout = 3000; // 3秒超时 + const timeout = 3000; let timer = null; testImg.onload = () => { clearTimeout(timer); - resolve(true); // 加载成功,有网 + resolve(true); }; testImg.onerror = () => { clearTimeout(timer); - // 图片加载失败,尝试请求一下当前页面的HTML头部(同源策略允许) - // 这是一个降级方案 fetch(window.location.href, { method: 'HEAD', cache: 'no-cache' }) .then(() => resolve(true)) .catch(() => resolve(false)); }; - // 设置超时 timer = setTimeout(() => { - testImg.src = ''; // 停止请求 + testImg.src = ''; resolve(false); }, timeout); - // 发起请求:使用百度地图的一个静态资源,或者您服务器上的一个小文件 - // 加上随机数防止缓存 testImg.src = 'https://api.map.baidu.com/images/blank.gif?t=' + Date.now(); }); } @@ -695,11 +678,12 @@ watchOrientationId: null, watchLocationTimer: null, mapLoaded: false, - // 网络相关 networkDebounceTimer: null, isNetworkRecovering: false, - heartbeatTimer: null // 心跳检测定时器 + heartbeatTimer: null }, + // 增加 isCreatingMarker 锁,防止多图标问题 + isCreatingMarker: false, locationIconCache: null, baiduGeolocation: null, lastHeading: null, @@ -725,8 +709,6 @@ this.initMap(this.state.projectInfo); this.renderProjectList(); this.handleUrlActions(params); - - // 重要:初始化增强版网络监听 this.setupNetworkListeners(); }, @@ -767,53 +749,29 @@ window.drawModel = this.drawModel.bind(this); }, - /** - * 增强版网络状态监听:包含心跳检测 - */ setupNetworkListeners() { - // 1. 先进行一次立即检测 this.performNetworkCheck(); - - // 2. 监听浏览器原生的 online/offline 事件(作为基础触发器) window.addEventListener('online', () => { - console.log('浏览器报告在线,正在验证真实连接...'); this.updateNetworkUIText('验证中...'); this.performNetworkCheck(); }); - window.addEventListener('offline', () => { - console.log('浏览器报告离线'); this.updateNetworkUI(false); }); - - // 3. 开启心跳检测定时器 (每5秒检查一次) - // 这是解决“热点假连接”的关键 if (this.state.heartbeatTimer) clearInterval(this.state.heartbeatTimer); this.state.heartbeatTimer = setInterval(() => { this.performNetworkCheck(); }, 5000); }, - /** - * 执行真实网络检查 - */ async performNetworkCheck() { const isConnected = await Network.checkInternetConnectivity(); - - // 获取当前显示的文本,判断是否还在“检查中” const textSpan = this.elements.networkStatus?.querySelector('.network-status-text'); const isChecking = textSpan && textSpan.innerText.includes('检查中'); - - // 获取当前样式状态 (是否有 offline 类) - // 注意:默认没有 offline 类,所以 isCurrentlyOnline 默认为 true const isCurrentlyOnline = !this.elements.networkStatus?.classList.contains('offline'); - // 修复:除了状态改变外,如果还在“检查中”状态,也必须更新 UI if (isConnected !== isCurrentlyOnline || isChecking) { this.updateNetworkUI(isConnected); - - // 逻辑细化:只有在真正从“断网”恢复到“有网”时(且不是初始检查),才触发地图刷新 - // 初始检查(isChecking=true)如果是在线的,通常不需要刷新地图 if (isConnected && !isCurrentlyOnline && !isChecking) { this.handleNetworkRecovered(); } @@ -821,21 +779,14 @@ }, handleNetworkRecovered() { - console.log('真实网络连接已恢复,等待稳定...'); - if (this.state.networkDebounceTimer) { clearTimeout(this.state.networkDebounceTimer); } - this.state.networkDebounceTimer = setTimeout(() => { if (this.map && !this.state.isNetworkRecovering) { - console.log('网络稳定,执行地图刷新'); this.state.isNetworkRecovering = true; - const zoom = this.map.getZoom(); - // 触发瓦片重载 this.map.setZoom(zoom + 0.000001); - setTimeout(() => { this.map.setZoom(zoom); this.state.isNetworkRecovering = false; @@ -847,7 +798,6 @@ updateNetworkUI(isOnline) { if (!this.elements.networkStatus) return; const textSpan = this.elements.networkStatus.querySelector('.network-status-text'); - if (isOnline) { this.elements.networkStatus.classList.remove('offline'); if (textSpan) textSpan.innerText = '网络: 正常'; @@ -1125,6 +1075,7 @@ }, _doUpdateLocationMarker() { + if (!this.map) return; const { lng, lat } = this.state.currentLocation; const point = new BMapGL.Point(lng, lat); if (this.overlays.locationMarker) { @@ -1170,11 +1121,21 @@ } }, + // 【优化点】加锁防止创建多个 Marker _createNewMarker(point) { + if (this.isCreatingMarker) return; + this.isCreatingMarker = true; + this.createRotatedLocationIcon(this.state.currentHeading).then((icon) => { + // 安全检查:如果在此期间有其他逻辑添加了 Marker,先清理 + if (this.overlays.locationMarker) { + try { this.map.removeOverlay(this.overlays.locationMarker); } catch (e) {} + } this.overlays.locationMarker = new BMapGL.Marker(point, { icon }); this.map.addOverlay(this.overlays.locationMarker); this.lastHeading = this.state.currentHeading; + }).finally(() => { + this.isCreatingMarker = false; }); }, @@ -1430,7 +1391,6 @@ clearTimeout(this.state.networkDebounceTimer); this.state.networkDebounceTimer = null; } - // 清理心跳检测定时器 if (this.state.heartbeatTimer) { clearInterval(this.state.heartbeatTimer); this.state.heartbeatTimer = null;