Express Helmet - CSS 未在 iOS Safari 上加载

Question

我刚刚将 Helmet 添加到我的 Node/Express/EJS 项目中，并配置了我的 CSP 以启用内联脚本、样式和一些外部源。我的 Windows 笔记本电脑上的 Opera、Chrome 和 Edge 运行良好，现在我正在 iOS Safari 移动设备上连接，但似乎没有应用任何样式。我成功获得了 Bootstrap（当然是 JS，我认为 CSS 也是如此，尽管它不是 100% 清晰，而且我在移动设备上没有控制台），但我自己的样式表和脚本没有正确加载。

这是我的代码：

app.use(
  helmet({
    contentSecurityPolicy: {
      directives: {
        scriptSrc: ["'self'", "'unsafe-inline'", "'unsafe-eval'", "*.googleapis.com", "*.jsdelivr.net", "*.jquery.com"],
        styleSrc: ["'self'", "'unsafe-inline'", "'unsafe-eval'", "*.googleapis.com", "*.jsdelivr.net", "*.jquery.com"],
        baseUri: ["'self'"],
        fontSrc: ["'self'", "https://fonts.gstatic.com"]
      }
    }
  })
)

我还注意到，每当我在 iOS Safari 上访问我的网站上的链接时，当我仅在本地主机服务器上使用 HTTP 时，它会自动强制使用 HTTPS。我有一种感觉，这可能是问题的原因 - 我的样式表被引用为

<link rel="stylesheet" href="/style.css" />

我认为 Safari 可能试图在

https://(laptop-private-ip):3000/style.css

处找到它，而实际上它应该搜索

http://(laptop-private-ip):3000/style.css

。是否有可能它正在尝试 HTTPS 链接，这就是为什么我无法检索自己的样式，但可以访问 Bootstrap 等？

我该怎么办？非常感谢任何帮助 - 我已经在这上面浪费了时间。

Answer 1

问题已解决。我不是 100% 确信这是问题所在，因为缓存似乎起了一定作用，但我相信这是以下原因之一。

• 升级不安全请求
• HSTS

Answer 2

只需清除缓存就可以解决这个问题。它只影响 Safari，不影响其他浏览器。