clear-site-data 响应头可清除 cookie、storage、cache 等，但仅服务端（nginx/apache/node.js）配置有效，需 https、同源、非重定向响应，且浏览器支持有限；前端仅能有限清理同源数据。
直接用 Clear-Site-Data 响应头就能清除当前站点的 Cookie、Storage、Cache 等，但必须由服务端返回，前端 JS 无法触发 —— 这是很多人卡住的第一步。
Clear-Site-Data 响应头怎么加（Nginx / Apache / Node.js）
它不是 HTML 标签或 JS 方法，而是 HTTP 响应头，只能在服务端配置。浏览器收到该响应后，才会主动清理本地数据。
- Nginx：在 location 块里加
add_header Clear-Site-Data '"cache","cookies","storage","executionContexts"'; - Apache：用
Header set Clear-Site-Data '"cache","cookies","storage","executionContexts"'（需启用mod_headers） - Node.js（Express）：
res.setHeader('Clear-Site-Data', '"cache","cookies","storage","executionContexts"');
注意：值必须是 JSON 字符串数组格式，每个项用双引号包裹并整体用单引号或双引号包住；"executionContexts" 会关闭所有同源 iframe 和 worker，慎用。
为什么加了头也没清掉？常见失效原因
这个头非常“娇气”，稍有不满足条件就会静默失败，不报错也不执行。
- 只对
HTTPS站点生效（HTTP 下完全忽略） - 必须是同源响应：比如你在
https://a.example.com访问，但请求发到https://b.example.com，即使加了头也不会清 a 站点的数据 - 不能在重定向响应中设置（302/307 响应里的
Clear-Site-Data被忽略） - 浏览器支持度：Chrome 61+、Edge 79+、Firefox 82+（Safari 不支持）
验证是否生效：打开 DevTools → Application → Clear storage → 点击 “Clear site data” 按钮右侧的小箭头，看是否有 “Cleared by Clear-Site-Data header” 提示。
替代方案：前端能做的有限但实用的清理动作
如果无法控制服务端（比如纯静态站点），就别硬套 Clear-Site-Data，改用明确可控的 JS 清理：
- 删 Cookie：
document.cookie.split(';').forEach(c => document.cookie = c.replace(/^ +/, '').replace(/=.*/, `=;expires=${new Date(0).toUTCString()};path=/`)); - 清 localStorage/sessionStorage：
localStorage.clear(); sessionStorage.clear(); - 清 Cache API：
caches.keys().then(keys => Promise.all(keys.map(k => caches.delete(k)))) - 清 IndexedDB：需遍历
indexedDB.databases()（Chrome 89+）或用已知库名逐个indexedDB.deleteDatabase(name)
这些操作都受限于同源策略，且无法清除 HTTP-only Cookie 或 Service Worker 注册本身（需 navigator.serviceWorker.getRegistrations().then(r => r.forEach(reg => reg.unregister()))）。
真正想一键清空，核心还是得走服务端响应头；前端代码只是补位。最容易被忽略的是 HTTPS 强制要求和同源限制——本地开发用 http://localhost 测，永远看不到效果。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
