如何使用来自其他域的SSL强制加载背景图像？

Question

我有一个在线商店，出于性能原因，图片在另一个域上。在网站的安全部分，我们强制 SSL连接，但不显示背景图片。当我尝试在浏览器中打开图像时，它要求我先接受安全证书。之后，图像就在那里。

我的CSS很简单：

.some_class {
    background: url('//another_domain.com/image.png') no-repeat;
}

当SSL处于活动状态时，有没有办法让浏览器显示来自其他域的背景图像？

如果我使用url的严格协议：

.some_class {
    background: url('https://another_domain.com/image.png') no-repeat;
}

比在非安全页面上看不到图像。

如果我使用http://，则页面不再安全。

Answer 1

如果您的域名为https://www.your_domain.com，但在css中使用硬编码协议

.some_class {
    background: url('http://another_domain.com/image.png') no-repeat;
}

该问题与“混合内容”有关 - HTTPS页面嵌入了HTTP资源（图像，脚本等）。

使用HTTPS的目的是确保只有原始服务器和客户端才能访问受保护的页面。但是，从理论上讲，如果嵌入了HTTP资源，则可能会破坏此安全性 - 服务器可能会拦截不安全的javascript文件并注入一些代码来更改安全页面的负载。

大多数浏览器会通过更改“安全锁定”图标来指示安全页面混合内容，方法是将锁定显示为打开或损坏，或者将图标设置为红色（Chrome会在短时间内显示骷髅和交叉骨骼） ，但他们意识到这对于潜在的威胁级别来说有点严重。）

如果another_domain.com是您的域名，则将SSL添加到该域名，这可能会解决您的问题。