如何使用RawGit與使用CDN
我的初衷為我想要把學習用的javascript與css檔放到網路上方便我在網頁中去include該javascript與css檔,
有網友提出使用dropbox,藉由開設public folder,
並使用「複製公開連結功能」來實現直接連結javascript與css檔,
可惜dropbox已不免費提供public folder功能了,
要升級成dropbox專業版(每年US$99)才行。
而另外還有一名熱心網友提出使用github功能,
經過嘗試的確可行,但你必須要專門開一個repo用來放置該.js或.css檔,
例如:http://brooke01.github.io/eat-food/style/grayscale.css
路徑取法為
(1)假設你有一個repository名為eat-food
(2)想使用style資料夾內的grayscale.css檔案
(3)則你的路徑組合為
http://你的站台名稱/repository名稱/資夾名稱/檔案
例:http://brooke01.github.io/eat-food/style/grayscale.css
但通常不會直接取用該檔案,而是再加上CDN來穩定該檔案的存取,
例如:https://cdn.rawgit.com/brooke01/eat-food/master/style/grayscale.css
路徑取法為
(1)使用rawgit來做cdn
承上例,必須先了解rawgit(含CDN)路徑組法。
https://cdn.rawgit.com/你的github名稱/repository名稱/Tag名稱/資夾名稱/檔案
https://cdn.rawgit.com/brooke01/eat-food/master/style/grayscale.css
何謂Tag名稱如下圖
(2)不含CDN的rawgit路徑組法就只是去掉開頭的cdn字串而已,如下
https://rawgit.com/brooke01/eat-food/master/style/grayscale.css
(3)至於什麼時候要使用CDN什麼時候不要,
則如果你的專案是開發階段、時常更新、極少人員使用則不使用CDN,
反之專案已穩定成熟為產品時、多人使用則需要用CDN
詳細解說為What's the difference between rawgit.com and cdn.rawgit.com URLs?
另外也有網友提出使用cdnjs,你可以先查看cdnjs上面有沒有你要的js或css資源,
如果沒有的話你也可以push你的檔案上去https://github.com/cdnjs/cdnjs,
此外還有一個jsdelivr,也是大同小異的。
參考資料: