我正在向页眉和页脚添加一个外部 CSS 文件和一个外部 JS 文件。加载 HTTPS 页面时,某些浏览器会抱怨我正在加载不安全的内容。
当页面本身是HTTPS时,有没有一种简单的方法可以让浏览器通过HTTPS加载外部内容?
我正在向页眉和页脚添加一个外部 CSS 文件和一个外部 JS 文件。加载 HTTPS 页面时,某些浏览器会抱怨我正在加载不安全的内容。
当页面本身是HTTPS时,有没有一种简单的方法可以让浏览器通过HTTPS加载外部内容?
使用协议相对路径。
因此不
<link rel="stylesheet" href="http://example.com/style.css">
<script src="http://example.com/script.js"></script>
但是所以
<link rel="stylesheet" href="//example.com/style.css">
<script src="//example.com/script.js"></script>
然后它将使用父页面的协议。
在评论后面的答案时,nute 和 James Westgate 是对的。
如果我们看一下杂项工业级外部 javascript 包含,成功的使用 document.location.protocol 嗅探和脚本元素注入 tu 使用正确的协议。
所以你可以使用类似的东西:
<script type="text/javascript">
var protocol = (
("https:" == document.location.protocol)
? "https"
: "http"
);
document.write(
unescape(
"%3Cscript"
+ " src='"
+ protocol
+ "://"
+ "your.domain.tld"
+ "/your/script.js"
+ "'"
+ " type='text/javascript'
+ "%3E"
+ "%3C/script%3E"
) // this HAS to be escaped, otherwise it would
// close the actual (not injected) <script> element
);
</script>
外部 CSS 包含也可以这样做。
顺便说一句:小心在你的 CSS 中只使用相对 url() 路径,如果有的话,否则你可能仍然会收到“混合安全和不安全”警告......
如果您使用相对路径(并且内容在同一个域中),那么内容应该使用请求页面的协议。
但是,如果您要跨域访问 CDN 或资源站点,或者需要使用绝对路径,则需要使用服务器端脚本来更改链接,或者始终使用 https://
与转义响应(也可以工作)相反,您可以跳过该部分并使用正确的方法将节点添加到您的 dom 树:
<script type="text/javascript" language="javascript">
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", document.location.protocol + '//www.mydomain.com/script.js');
document.getElementsByTagName("head")[0].appendChild(fileref);
</script>
但是协议相关的路径将是要走的路。