localstorage 控制下载引导页仅对新用户或未看过者展示一次，通过探测可用性、存取布尔标记、叠加时间与入口策略实现稳定显隐，且与app唤起逻辑解耦。
用 localStorage 控制 APP 下载引导页是否展示，核心是“只对新用户或未看过的人显示一次”，不是靠猜，而是靠存一个标记。它不负责下载、也不唤起 APP，只管“要不要弹这个横幅”。关键在于写得稳、读得准、失效有兜底。
一、用 localStorage 记住“已展示过”
用户第一次访问页面时，检查有没有一个叫 download_banner_shown 的键：
- 没有 → 展示引导横幅，并立即执行
localStorage.setItem('download_banner_shown', '1') - 有（值为 '1'）→ 直接隐藏横幅，不打扰
注意：不要用 new Date().getTime() 存时间戳再比对天数——移动端本地时间可能不准，且没必要。简单布尔语义更可靠。
二、避免低端机上“存了却读不到”
部分 Android 4.x 或定制 ROM 浏览器会返回 localStorage 可用，但实际 setItem 后 getItem 为空。所以不能只判断 'localStorage' in window。
推荐封装一个探测函数，在页面加载早期运行：
function canUseLocalStorage() {
try {
const testKey = '__ls_test__';
localStorage.setItem(testKey, 'ok');
if (localStorage.getItem(testKey) === 'ok') {
localStorage.removeItem(testKey);
return true;
}
} catch (e) {}
return false;
}
只有返回 true 才真正写入 download_banner_shown；否则降级为内存变量（let bannerShown = false），本次有效，刷新即重置——虽不持久，但至少不报错卡死。
三、控制展示频次与场景
单纯“只展示一次”容易误伤：用户清缓存后又看到；或者从微信内嵌浏览器进来，localStorage 隔离导致重复展示。可叠加轻量策略：
- 加时间维度：存
{ shown: true, ts: Date.now() }，配合localStorage探测，24 小时内不再展示（适合反复打开的用户） - 区分入口：比如只在首页
/展示，不在子页面如/article/123触发，避免路径跳转后误判 - 避开隐私模式：检测
window.navigator.cookieEnabled === false且localStorage不可用时，直接跳过存储逻辑
四、和唤起逻辑解耦，别混在一起
localStorage 只管“显隐”，不管“点下去能不能打开 APP”。唤起失败检测（超时 + pagehide）、跳应用商店链接、 fallback 到二维码——这些都该在按钮点击事件里独立处理。
错误做法：if (!localStorage.getItem(...)) { window.location.href = 'myapp://home'; }
✅ 正确做法：
横幅显示由 localStorage 决定；点击行为必须绑定真实 click，内部再走唤起+超时逻辑，互不干扰。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
