HTML网页广告无法靠前端真正限制每日展示上限，因浏览器无可信时间、localStorage可被清除、JS可被禁用或绕过；必须由服务端基于真实身份、服务端时间窗口和区分类型的计数key（如ad:show:home-banner:{userId}）完成校验，前端仅作缓存代理与体验拦截。
HTML网页广告无法靠前端代码真正限制每日展示上限——浏览器没有可信时间源、localStorage可被清除、用户能禁用JS或直接绕过DOM，所有“每天最多X次”的逻辑必须由服务端完成。前端唯一能做的，是配合服务端做体验层拦截和状态缓存。
为什么 localStorage 计数会失效
常见错误是把 uploadCountToday 或 adShownCount 存进 localStorage 后就以为万事大吉。但实际中：
- 用户清空浏览器数据，计数归零
- 换设备、开无痕窗口，
localStorage完全不共享 - 页面未加载完就点击“跳过”，
count++没执行，但广告已渲染，导致漏记 - 多个标签页并发打开，
getItem+setItem非原子操作，计数可能重复加
前端该怎么做：只在服务端校验通过后才更新本地状态
前端不是限制主体，而是服务端策略的“缓存代理”。关键动作必须串在服务端响应之后：
- 广告请求发往后端接口（如
/api/ad?slot=home-banner），而非直连第三方 iframesrc - 后端返回 200 且含
{"ad": {...}, "remaining": 2}，才渲染广告，并执行：localStorage.setItem('ad_remaining_home-banner', '2') - 若后端返回 429 Too Many Requests，前端立即禁用广告容器：
adContainer.classList.add('ad-disabled')，并显示“今日已达到展示上限” - 每次广告曝光（即
IntersectionObserver确认进入视口）后，再发一次轻量上报/api/ad/impression?id=xxx，服务端据此累加真实曝光数
服务端必须校验的三个硬性条件
仅靠“用户ID + 时间戳”还不够，以下三点缺一不可：
Wechat Article Html
下载
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
- 绑定真实身份：不能信前端传的
userId，必须从 JWT token 或 session 中解析，且验证签名 - 使用服务端时间窗口：查数据库或 Redis 时，用
NOW() - INTERVAL 1 DAY或EXPIREAT（非EXPIRE），避免客户端时间篡改 - 区分展示类型：首页 banner、侧栏弹窗、视频前贴片应为不同计数 key，比如
ad:show:home-banner:{userId}和ad:show:preroll:{userId}
iframe 广告怎么套这个逻辑
第三方广告联盟（如 AdSense、百度网盟）不支持你插手其内部计数，所以不能直接限制它们的展示频次。可行路径只有两条：
- 把广告联盟代码封装进自己的代理接口：前端请求
/proxy/ad?network=taboola&slot=top，后端按规则决定是否转发给 Taboola，否则返回空或备用广告 - 用
iframe的sandbox="allow-scripts"加载广告，但外层容器由 JS 控制显隐——当服务端返回“今日已达上限”，就直接移除整个iframe元素，不给它执行机会 - 绝对不要在
iframe上设display: none后还留着 DOM，很多广告 SDK 会在visibilitychange事件里自动重载
最常被忽略的一点：广告展示上限不是独立策略，它必须和用户行为日志、反作弊规则联动。比如同一 IP 下多个账号高频切换，或单个设备在 1 小时内触发 50+ 次曝光请求，这类信号要进风控队列，而不是简单计数归零。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
