随机混合内容问题答案

【问题标题】：Random Mixed Content Issue随机混合内容问题
【发布时间】：2018-02-23 02:42:22
【问题描述】：

我的网站遇到了一个奇怪的混合内容请求阻止问题，相信我已经在谷歌上搜索了两个多月来解决这个问题。

我使用 AngularJS1 作为前端，使用 Spring boot 作为后端。

当我访问我的网站时，有时会随机出现以下错误：

混合内容：http://mywebsite 的页面通过 HTTPS 加载，但请求了不安全的 XMLHttpRequest 端点“http://mywebsite.com/”。此请求已被阻止；内容必须通过 HTTPS 提供。

但是当我刷新或重新加载页面时，这个问题就消失了。之后，一切都按预期完美运行，因为我没有使用任何 HTTP ajax 调用，而只使用内部 HTTPS ajax 调用。

我什至使用第三方工具检查了我的网站是否有一些使用“http”的请求，并且我的网站是干净的。

这个问题并不总是发生。它是随机发生的，但如果我刷新页面，它总是会消失。

请帮我解决这个问题。

============== 截至 2018 年 3 月 27 日的更新状态 =================

虽然我做了一个解决方法，但我仍然遇到同样的问题。我添加了 errorCallBack 来捕获除 Ajax 调用的 HTTP 500 错误之外的所有错误，该调用仅重新加载页面一次，以便重新加载页面从而解决问题。

但这不应该是一个解决方案。请任何人帮助我。

【问题讨论】：

@codtex 感谢您的评论。实际上我根本没有做 HTTP AJAX 请求。我只调用 HTTPS 内部 AJAX 调用。这就是我如此困惑的原因。
对不起，伙计，我一开始就错过了这一点。我认为您应该以某种方式弄清楚这是什么时候发生的，我认为这不是随机发生的，而且一定是有什么原因造成的。您能否也发布执行 AJAX 请求的代码？
请问有人吗？ :(
好吧，仅仅几张截图并没有让我们有机会弄清楚到底发生了什么。所以此时我唯一的建议是查看网络面板中的 Initiator 列，看看这是否有助于缩小应用程序的哪个部分导致这些请求开始。
发布导致问题的 AJAX 请求的代码。您是否动态构建请求 url？如果有什么东西迫使 jquery.ajax 使用 http 协议而不是 https （这很奇怪） 你可以尝试使用 AJAX 调用原生XMLHttpRequest

【解决方案1】：

你可以试试这个：-

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />

或者

<meta http-equiv="Content-Security-Policy" content="block-all-mixed-content" />

将其粘贴到<head>...</head> 标签中。

当使用 HTTPS 加载页面时，HTTP Content-Security-Policy (CSP) block-all-mixed-content 指令可防止使用 HTTP 加载任何资产。

所有混合内容资源请求都被阻止，包括主动和被动混合内容。这也适用于<iframe> 文档，确保整个页面没有混合内容。

upgrade-insecure-requests 指令在 block-all-mixed-content 之前进行评估，如果设置了前者，则后者实际上是空操作。建议设置一个指令或另一个——不要同时设置。

【讨论】：