14

我正在拆分我的一个较大的应用程序并引入一个“cdn”url 来容纳 CSS、javascript 和图像等常见对象以避免重复。不过，我需要做的是为我们的开发环境提供单独的 URL，所以我可能有：

http://cdn-dev.example.com
http://cdn-qua.example.com
http://cdn.example.com

取决于我们工作的环境。我可以让它为我们的 PHP 代码生成的东西工作，但我对将被调用的 .css 和 .js 文件不知所措。例如，我该如何制作：

.cool-button { background-image: url('http://cdn.example.com/images/button.png'); }

在不同的域之间切换？

处理它的最佳方法是什么？

[编辑]

大家都很清楚，CDN 地址与站点是不同的域。因此，开发站点可能是http://www-dev.domain.com，它将使用http://cdn-dev.domain.com

4

9 回答 9

26

使用相对路径，而不是绝对路径。在 CSS 文件中时，路径是相对于 CSS 文件而不是 HTML 页面的。

如果你的 CSS 文件在这里

http://cdn.example.com/css/style.css

你的课是

.cool-button { background-image: url('../images/button.png'); }

然后浏览器将尝试从

http://cdn.example.com/images/button.png
于 2009-05-13T16:01:05.897 回答
6

只使用域相对网址？

.cool-button { background-image: url('/images/button.png'); }

然后浏览器将在当前域下查找。

于 2009-05-13T16:00:01.670 回答
2

您还可以有一个构建过程并使用模板来生成特定于环境的文件

例如在一个名为 yoursite.template.css 的文件中

.cool-button { background-image: url('@@URL@@/images/button.png'); }

创建 yoursite.css 文件，而不是将 @@URL@@ 替换为您想要的域。

于 2009-05-13T16:10:01.887 回答
2

根据您的服务器配置，您还可以将 .php 扩展名附加到文件名，并将它们也视为 PHP 脚本：

I.E.: style.css.php would contain:

.cool-button { background-image url(<?php echo $bgImgUrl;?>); }

这也适用于 JavaScript 文件。

于 2009-05-14T13:00:17.090 回答
1

我今天实际上一直在做同样的事情，这就是我想出的。

将其粘贴到站点根目录下的 .htaccess 文件中。这显然依赖于 Apache 和 Mod_rewrite。

RewriteEngine on
RewriteBase /

# Redirect content to the CDN

RewriteCond %{HTTP_HOST} !^cdn\.server\.com$    [NC]
RewriteRule .*\.(jpg|gif|png|flv|css|js|swf)$   http://cdn.server.com/$0    [R=301,L]

这会将括号中的文件类型的请求发送到您的 cdn，并在您的主服务器上保留对其他类型的请求。

于 2009-05-13T16:00:40.890 回答
1

在寻找这个问题的答案时，我看到了一个简单的：创建具有重复类的 css 文件，一个用于场景 1（从同一域加载图像），另一个用于场景 2（从 CDN 加载图像）。

例如

.container {background-image:url(my/site/image.png;)}
.container-CDN {background-image:url(http://my.site.cdn.com/image.png;)}

然后在你的 index.php 中引入 PHP 来调用正确的类

例如

<body class="container<?PHP if ($whatever) {echo "-CDN";} ?>">
于 2011-05-12T11:45:23.030 回答
0

如果服务器相同，则可以使用相对路径。像 /http/blah/test/images/button.png 或 ../images/button.png

于 2009-05-13T16:01:08.237 回答
0

使用相对 URL 时，您可以强制使用“基本”URL。在 <head> 标记中，使用 <base href="http://cdn-dev.example.com">。然后，每个相对链接“/style.css”都会指向“ http://cdn-dev.example.com/style.css ”

供参考：http ://www.w3schools.com/TAGS/tag_base.asp

于 2009-05-13T16:05:52.097 回答
0

嗯......我想出的解决方案是......有点......hackish，丑陋和愚蠢。但是，见鬼，它奏效了：

<?php
    if ($_SERVER['SERVER_NAME'] == "www.domain.tld") {

        $incs_path  = "/usr/local/psa/home/vhosts/domain.tld/non-web-root-folder/private-files";

    }
    else {
        $incs_path  = "incs";
    }

require_once "$incs_path/$file-to-be-called.inc";

?>

如前所述，这既笨拙又丑陋，并且可以做得更漂亮。但它至少允许您根据主机定义特定文件组的特定位置。

于 2009-05-13T16:12:48.390 回答