AngularJS 模板无法通过 HTTPS 加载

Question

我从 Cloudflare 获得了我的 SSL，他们直接将其分配到我的域并自动将所有 http 重定向到 https。

话虽如此，我正在努力让我的 angular 模板通过 https 加载。

错误信息是：

Mixed Content: The page at 'https://mydomain.io/components/index/#/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://mydomain.io/components/index/header'. This request has been blocked; the content must be served over HTTPS.

这看起来有点直截了当，但我一直在努力解决这个问题，但我不能...

这就是我从 directive.js 文件加载模板的方式：

app.directive('navHeader', function() {
    return {
        templateUrl: function() {
            var useHTTPS = window.location.href.indexOf('https') > -1;
            if (useHTTPS) {
                return 'https://mydomain.io/components/index/header.html';
            } else {
                return 'header.html';
            }
        }
    };
}),

但这显然行不通...

有什么想法吗？这可能是 cloudflare 的错吗？

Answer 1

这可能是@Cloudflare 的原因，

因为您正在尝试访问 https 而不是 http 的数据，但问题是服务器正在响应协议与否，因此您需要检查服务器端的重定向，

如果任何请求来自 http 或 https，那么它将始终重定向到 https 服务器。

AngularJS 模板无法通过 HTTPS 加载

AngularJS templates fail to load over HTTPS

javascript

https

angularjs

angularjs-directive