Magento CSS 图像指令和 CDN 冲突

Question

我在这里看到了一些关于当 CSS 托管在 CDN 中时 CSS 中的相对图像路径不起作用的问题的帖子，但我遇到了无法找到答案的情况。在我们的 Magneto 商店中，我们启用了合并 CSS 功能。不幸的是，在 Magento 中，当您执行此操作时，它会将它们合并到 media 文件夹中的单个文件，而不是 skin 文件夹中。所以现在，图像的相对路径不起作用。当 Magento 在非安全 URL 中找不到资源时，它会尝试安全 URL。在我们的例子中，我们不使用 CDN 来创建安全页面，因此它可以使用安全 URL 来查找图像。这在技术上是可行的，但我们的网站返回图像的速度比 CDN 慢，我真的很想解决这个问题。缺少遍历所有 CSS 精灵并将 CDN URL 硬编码为图像路径（不可取）或一起删除 CSS 指令并调用 getSkinUrl() 在包含违规元素的模板文件中（稍微不那么不受欢迎），我不知道如何解决这个问题。肯定有人以前遇到过这个问题。关于如何解决这个问题有什么建议或想法吗？

谢谢！

Answer 1

实际问题与 CDN 或合并的 CSS 文件相对于图像的位置无关。 Magento 实际上做了一些很酷的事情...它解析 CSS 文件并用完整的 URL 填充所有相对 URL。它在 Mage_Core_Model_Design_Package 类的 _prepareUrl 方法中执行此操作。它在以下行中确定是使用安全 URL 还是非安全 URL：

$secure = $store->isAdmin() ? $store->isAdminUrlSecure() : $store->isFrontUrlSecure();

这里的问题是，即使相关页面实际上并不安全，它也会使用安全 URL。如果您启用了在前端使用安全 URL，则它不会始终使用安全 URL。它仅在客户帐户页面和购物车/结账页面上使用它们。任何其他页面都不安全，并且不需要安全资源。

合并 URL 时，Magento 很聪明，它会在 media 文件夹下创建一个 css 和 css_secure 文件夹。如果您查看客户帐户页面的源代码，您会注意到它从 css_secure 文件夹中提取 CSS，但在主页上它使用 css 文件夹。因此它已经被设置为了解安全页面和非安全页面之间的区别，但 CSS 的合并并没有考虑到这一点。

为了解决这个问题，我做了一个基本扩展，使用新的 _prepareUrl 方法重写了 core/design_package 模型。唯一的区别是，在上面提到的行之后我添加了以下内容：

$secure = $secure && Mage::app()->getRequest()->isSecure();

这确保只有 css_secure 文件夹中合并的 css 文件才能获取资源的安全 URL。

希望这对遇到类似问题的人有所帮助。

Answer 2

自行将您的 CSS 文件合并为一个，并更改标头 xml 以仅提取这一个 css 文件。然后 CSS 应该能够与您的图像一起存在于 CDN 上。我知道这不是一个非常奇特的解决方案，但无论如何，它可能值得深入研究一个 CSS 文件（每个主题）。