diff --git a/index.html b/index.html index 79eac0e..5dcbccd 100644 --- a/index.html +++ b/index.html @@ -85,6 +85,9 @@ // 防抖多次点击 let isClickable = true; + // 记录页面打开时间 + const pageOpenTime = getBeijingTime(); + // 获取北京时间(东八区)的函数 function getBeijingTime() { const date = new Date(); @@ -92,8 +95,21 @@ return beijingTime.toISOString(); } - // 记录页面打开时间 - const pageOpenTime = getBeijingTime(); + // 缓存键名 + const CACHE_KEY = 'landing_image'; + + // 从缓存获取落地图 + function getLandingImageFromCache() { + const cached = localStorage.getItem(CACHE_KEY); + return cached ? JSON.parse(cached) : null; + } + + // 将落地图存入缓存 + function saveLandingImageToCache(imageUrl) { + localStorage.setItem(CACHE_KEY, JSON.stringify({ + url: imageUrl, + })); + } // 获取图片方法 async function getImage() { @@ -106,25 +122,51 @@ }; } else { console.warn('网络错误,请稍后重试'); + return null; } } catch (error) { console.error('网络错误,请稍后重试'); + return { + landingImageUrl: './assent/8折页面.png', + popupImageUrl: './assent/弹窗样式2.png' + }; } } // 加载 window.onload = async function () { try { + // 缓存 + const cachedImage = getLandingImageFromCache(); + + // 接口 const imagePaths = await getImage(); - // landingImage.src = imagePaths.landingImageUrl; - // popupImage.src = imagePaths.popupImageUrl; - landingImage.src = './assent/8折页面.png'; - popupImage.src = './assent/弹窗样式2.png'; - - // 弹窗展示 - setTimeout(() => { - popup.classList.add("show"); - }, 500); + + // 确定最终落地图和是否展示弹窗 + let finalLandingUrl; + let shouldShowPopup = false; + + if (imagePaths?.landingImageUrl) { + finalLandingUrl = imagePaths.landingImageUrl; + if (!cachedImage || cachedImage.url !== finalLandingUrl) { + shouldShowPopup = true; + saveLandingImageToCache(finalLandingUrl); + popupImage.src = imagePaths.popupImageUrl; + } + } else { + // 接口失败时使用缓存(如果有) + finalLandingUrl = cachedImage?.url; + } + + // 4. 设置落地图 + landingImage.src = finalLandingUrl; + + // 5. 新增:根据对比结果决定是否展示弹窗 + if (shouldShowPopup) { + setTimeout(() => { + popup.classList.add("show"); + }, 500); + } } catch (err) { console.error('页面初始化失败'); }