0

我有一个简单的网站，在标题中包含对 css 文件和 javascript 文件的相对引用。有没有办法将这些扩展为绝对 url，并在它们前面加上“cdn”。在页面加载时自动？

这是我当前头脑的一部分：

<link rel="stylesheet" type="text/css" href="css/default.css">
<link rel="stylesheet" type="text/css" href="css/the-tooltip.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="js/utf8.js" type="text/javascript"></script>
<script src="js/sha1.js" type="text/javascript"></script>
<script src="js/validatious.js" type="text/javascript"></script>

我最终需要的是

<link rel="stylesheet" type="text/css" href="http://cdn.mydomain.com/css/default.css">
<link rel="stylesheet" type="text/css" href="http://cdn.mydomain.com/css/the-tooltip.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://cdn.mydomain.com/js/utf8.js" type="text/javascript"></script>
<script src="http://cdn.mydomain.com/js/sha1.js" type="text/javascript"></script>
<script src="http://cdn.mydomain.com/js/validatious.js" type="text/javascript"></script>
4

3 回答 3

1

以下是如何为所有脚本元素添加前缀：

function appendPrefix(prefix) {
  var scripts = document.getElementsByTagName('script'),
      links =  document.getElementsByTagName('link'),
      foreach = Array.prototype.forEach;
  foreach.call(scripts, function (s) {
    if (s.src && (/(http|https)/).test(s.src)) {
       s.src = prefix + s.src;
    }
  });
  foreach.call(links, function (l) {
    if (s.src && (/(http|https)/).test(l.href)) {
       l.href = prefix + l.href;
    }
  });
}

appendPrefix('http://stackoverflow.com/');

该脚本是纯 JavaScript，适用于script和link标签。它只会将前缀附加到那些link不script以http://.

于 2013-01-16T13:25:51.987 回答
-1

您可以执行重定向请求/css/*或/js/*到cdn.example.com/css/*或cdn.example.com/js/*在 Web 服务器的配置文件中（例如，用于 Apache 服务器的 .htaccess）和浏览器获取必要的文件。此解决方案将在您的 Web 服务器上产生负载（不像发送 css 或 js 文件那样多），因此最好手动写入 cdn 的路径。

于 2013-01-16T13:41:10.517 回答
-1

看起来JS不是最好的解决方案。我在服务器端使用 PHP 解决了这个问题。我定义了一个全局 $prefix 变量并将其附加到动态生成的主机名和路径中，以获取绝对 URL 并仍然保持脚本的可移植性。

于 2013-01-17T12:13:07.850 回答