如何使用 angularjs 检测混合内容？

Question

我有一个angularjs 应用程序在tomcat 上运行，在loadbalancer 后面运行

如果通过负载均衡器使用https 请求应用程序，那么均衡器仍然会在内部通过http 请求应用程序，当然。

问题：在这种情况下，我想隐藏一个显示混合内容的选项卡（因为我必须嵌入不支持 https 的外部 pdf 链接，因此我想隐藏它们）。

我无法使用$location.protocol()，因为该应用位于负载均衡器后面，并且始终只能获得http。

问题：我是否有可能检测到浏览器是否实际显示mixed content？

Answer 1

您无法以简单的方式检测到它。您可以尝试在 iframe 上监听 load 事件并设置超时，当超时触发时，阻止 iframe，因为 iframe 没有像这样加载（jsfiddle example）：

checkMixedContent(urlToCheck, function(urlToCheck) {
    // For example, change location
    alert('ok');
    // load iframe
}, function() {
    alert('Error: resource timed out');
    // hide iframe / show message
}, checkDelay);

function checkMixedContent(urlToCheck, successCallback, errorCallback, checkDelay, dontCheckOnError) {
    checkDelay = checkDelay || 10000;
    // 1. Create invisible iframe and append it to body
    var iframeHelper = document.createElement("iframe");
    iframeHelper.src = urlToCheck;
    iframeHelper.height = 0;
    iframeHelper.width = 0;
    iframeHelper.style.visibility = 'hidden';
    document.body.appendChild(iframeHelper);

    // 2. Set time out and while content on iframeHelper.src should be definitely loaded
    var checkTimeout = window.setTimeout(function() {
        errorCallback(urlToCheck);
    }, checkDelay);

    var onLoad = function() {
        window.clearTimeout(checkTimeout); // if OK - not show error => clearTimeout

        iframeHelper.removeEventListener('load', onLoad);
        iframeHelper.removeEventListener('error', onError);
        document.body.removeChild(iframeHelper);
        successCallback(urlToCheck);
    };

    var onError = function() {
        window.clearTimeout(checkTimeout); // if OK - not show error => clearTimeout

        iframeHelper.removeEventListener('load', onLoad);
        iframeHelper.removeEventListener('error', onError);
        document.body.removeChild(iframeHelper);
        errorCallback(urlToCheck);
    };

    // 3. If everything is fine - "load" should be triggered
    iframeHelper.addEventListener('load', onLoad);


    // Turn "true" in case of "X-Frame-Options: SAMEORIGIN"
    if (!dontCheckOnError) {
        iframeHelper.addEventListener('error', onError);
    }

}