前端调试必备：彻底清除浏览器和微信开发者工具的 HSTS 缓存

在前端开发中，我们经常需要本地调试微信网页项目。有时候遇到一个非常头疼的问题：

一个域名既支持 HTTP 也支持 HTTPS，但访问 HTTP 时总是自动跳转到 HTTPS，导致本地调试无法进行。

如果你也遇到这种情况，这篇文章教你彻底清除 浏览器 和 微信开发者工具 的 HSTS 缓存，让你的调试恢复正常。

---

🔎 什么是 HSTS？

HSTS（HTTP Strict Transport Security）是一种浏览器安全策略，网站通过响应头告诉浏览器：

“以后访问我，不要再走 HTTP，强制用 HTTPS。”

示例响应头：

Strict-Transport-Security: max-age=31536000; includeSubDomains

• max-age=31536000 表示 1 年内强制 HTTPS

• includeSubDomains 表示所有子域名也强制 HTTPS

一旦浏览器记住了这个策略，即便你手动输入 http://，也会被强制跳转到 https://。

这对于生产环境很安全，但对于本地调试就非常不方便。

---

🖥 PC 浏览器 HSTS 清理方法

1. 清理 Chrome / Edge 的 HSTS 缓存

1. 打开地址栏，输入：

chrome://net-internals/#hsts

2. 滚动到 Delete domain security policies 区域

3. 输入要清理的域名（不要带 http:// 或路径），点击 Delete

4. 再次访问 HTTP，浏览器就不会强制跳转了

✅ 这个方法不会影响其他域名的缓存，调试时安全可靠。

---

2. 清理 Firefox 的 HSTS 缓存

1. 打开 about:preferences#privacy

2. 滚动到 Cookies 和网站数据，点击“管理数据”

3. 搜索要清理的域名，删除即可

或者更彻底的方法：

1. 打开 about:config
2. 搜索 hsts
3. 清理对应站点的缓存记录

---

🛠 微信开发者工具 HSTS 清理方法

浏览器清理完，微信开发者工具依然可能强制跳转，这是因为它有独立的 HSTS 缓存。

macOS 操作步骤

1. 关闭微信开发者工具
2. 打开终端，执行：

rm -rf ~/Library/Application\ Support/微信开发者工具/50a7d9210159a32f006158795f893857

2. 这个长串是当前版本的用户数据目录，不同版本可能不一样，可以先用 ls 查看确认。

3. 重新打开微信开发者工具，HTTP 访问恢复正常

Windows 操作步骤

1. 关闭微信开发者工具
2. 打开文件资源管理器，访问：

C:\Users<你的用户名>\AppData\Local\微信开发者工具\User Data\

2. 删除里面的对应缓存目录（通常是一个长串的哈希值目录）
3. 重启微信开发者工具

---

🧠 最佳实践建议

为了避免以后再次踩坑，可以考虑：

• 使用专用调试域名：比如 dev.xxx.com，避免污染生产域名的 HSTS 缓存
• Nginx 反向代理到本地：保持测试环境和线上环境域名一致，便于调试
• 浏览器插件辅助：用 Requestly 等工具把请求重定向到本地，减少频繁清理缓存

---

🔑 总结

清理 HSTS 的关键是找到缓存存储的位置：

• Chrome / Edge：通过 chrome://net-internals/#hsts 删除策略

• 微信开发者工具：手动删除用户数据目录中的缓存文件夹

这样就能让 HTTP 重新可访问，恢复本地调试能力。

---