使用javascript爲cdn添加前綴相對路徑

我有一個簡單的網站，其中包含相對於頭文件中的css文件和JavaScript文件的引用。有沒有辦法將這些擴展爲絕對網址，並用「cdn」作爲前綴。自動頁面加載？使用javascript爲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>

來源

2013-01-16 Maciej Swic

這裏是你如何可以添加前綴所有腳本元素：

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標籤。它會將前綴僅附加到那些不以http://開頭的link和script標籤。

來源

2013-01-16 13:25:51

看起來不錯。我可以以某種方式確保它在瀏覽器嘗試獲取實際文件之前運行？ –

加載開始前您無法運行它。加載在DOM元素位於DOM樹中時開始，因此在DOM樹中不能替換元素的「href」和「src」屬性。 –

-1

可以/css/*或/js/*也將請求重定向到cdn.example.com/css/*或cdn.example.com/js/*的Web服務器（例如，針對的.htaccess的Apache服務器）和瀏覽器的配置文件獲取必要的文件。這個解決方案將使你的web服務器負載（不像發送css或js文件），因此最好手動寫入cdn路徑。

來源

2013-01-16 13:41:10

感謝您的建議，但除加載之外還有另一個大問題。這實際上迫使用戶一次又一次連接到我的服務器，然後是cdn，而不是直接從cdn請求資源。不幸的是，這個解決方案沒有cdn的一點。 –

我明白，但沒有其他自動化解決方案。客戶端的變化（javascript）不能解決問題。 –

看起來像JS不是最好的解決方案。我用服務器端的PHP解決了這個問題。我定義了一個全局$前綴變量，並將其附加到動態生成的主機名和路徑以獲取絕對URL並仍保持腳本的可移植性。

來源

2013-01-17 12:13:07

使用javascript爲cdn添加前綴相對路徑

回答

相關問題