2015年2月1日 星期日

[小工具] 徹底解決網站外連空間問題﹍幫 Google Drive 的 JS 檔買保險

[小工具] 徹底解決網站外連空間問題﹍幫 Google Drive 的 JS 檔買保險

Wayne Fu 0 A+
Google Drive 上星期發生了「JS 檔外連失效」事件,雖然日前已經修復,但相信所有經歷這件事的站長都不好受,心理也會留下陰影,是否哪天殘破的部落格版面又要重現?

誠如我在上一篇提到的,「放在雲端的任何東西,沒有一樣是絕對安全的」,網站隨時有開天窗的風險總是無法安心。不想讓舊事一再重演,必須幫部落格四項重要資料「範本、文章、圖片、外連」買保險。本篇將說明,如何為網站的 "外連檔案" 找到各種備胎,並在出狀況時由系統自動替換,省去人工手動更換各處連結,算是一個徹底解決的方案。

方法雖好,不過算是程式人的工具,若熟悉 Javascript、Jquery 的站長比較能自行處理。



一、分散式檔案管理


先說明一下原理,如同伺服器一般,為了確保檔案存取正常,不受任何事故而影響資料庫,那麼各種意外導致的異常,例如天災、斷電、未授權的存取(駭客)等等,必須將檔案同步異地存放。經由分散式的檔案管理,事故發生時可由備份處取得檔案內容、或立即回覆狀態,絲毫不影響伺服器的運作。

經由同樣的構想,如果在 Google Drive(或你的主要雲端空間)發生的異常狀態,導致所有外連檔案失效,而我們能事先將所有檔案,在另一個雲端空間保有備份,經由本文工具的輔助,當偵測到異常狀態時,自動改用備份空間的連結,就能解決「雲端外連空間無法信任」這個問題了。

然而,我們要怎麼讓程式判斷,Google Drive 的 A 檔案,自動對應到另一個空間的同一個 A 檔案呢?程式很短很好寫,但如何對應檔案才是最大的問題。

解決的方法為,我們準備的所有雲端空間,都必須是「支援目錄路徑」的空間。如此雖屬不同空間,但檔名相同時,就能自動判斷了。



二、準備「支援目錄路徑」的雲端空間


說真的,「支援目錄路徑」的雲端空間並不多,且漸漸都開始收費了,也許站長們可趁還沒收費前搶先註冊帳號。不過維持外連檔案、確保網站運作這件事很重要的話,如果將來雲端空間開始收費、且金額不大時,我想這筆開銷是必須的。

以下提供幾個目前 WFU 知道的「支援目錄路徑的雲端空間」,有相關資訊的讀者也歡迎補充:

1. Google Drive:2016.4.12 補充:由於「Google Drive 檔案外連功能將於 2016 年 8 月關閉」,第 1 點的內容可略過。

既然已經修復了,就繼續使用。其目錄路徑格式大致長的像這樣──

https://googledrive.com/host/0BxkdlfTTti-aSlU3SDg5RUVtNll/檔案名稱.js
取得 Google Drive 外連路徑的方法,請參考「Google Drive 取得檔案外連網址原理分析」、「Google Drive 外連產生器」。


2. Dropbox:很可惜,2012 以後才註冊的使用者,必須付費才能使用。其目錄路徑格式大致長的像這樣──

https://dl.dropboxusercontent.com/u/39186009/test/檔案名稱.js

3. Hinet:我本身是 Hinet 用戶,所以有免費的 60MB 空間。如果你也是 Hinet 用戶,可以申請來當備用的外連空間,放多少 JS 檔都綽綽有餘。其目錄路徑格式大致長的像這樣──

http://帳號名稱.myweb.hinet.net/檔案名稱.js

4. Google Site:這個平台需要一點時間上手,詳細的介紹及操作教學請參考這篇「Google 協作平台


5. Github::對於大部分部落格站長而言,Github 的使用概念比較不一樣,要熟悉這個平台需要不少時間,可參考這篇文章進行註冊、安裝、及上傳:「用 Github 存取網頁 JS/CSS 外連檔案 + 使用技巧」。


想知道還有哪些雲端空間,可在這個 WIKI 頁面「Comparison of file hosting services」,從 "Direct access" 這一欄尋寶,看能否找到「支援目錄路徑的雲端空間」,有點難度就是。



三、安裝工具


在修改範本之前,如果第一次安裝本站工具的讀者,建議先閱讀「備份範本的訣竅」系列文章。

1. 請到後台「範本」→「編輯 HTML」,游標點進範本區塊,按 Ctrl-F 搜尋 </head> 這個字串,找到後在此字串的前一行,插入以下程式碼:


以下參數修改請參照以上程式碼行號:

B:這一行可參考「引用 jQuery 的注意事項」,檢查範本是否已安裝過 jquery,以免重複安裝。

F:紅色字串請填入主要的雲端空間資料夾路徑,例如前面提到的 Google Drive 目錄路徑,但不包含檔名字串 (檔案名稱.js)。

G:紅色字串請填入備用的雲端空間資料夾路徑,例如前面提到的 Dropbox 或 Hinet 目錄路徑,但不包含檔名字串 (檔案名稱.js)。

儲存後請看接下來的檔案外連使用方法。



四、基本使用方法


安裝本文工具後,等於是外連檔案交給這個工具託管,那麼呼叫外連檔案的方式也需要修改。

1. 所有外連的檔案,請放在同一個資料夾,也就是程式碼 F、G 行自己設定的那些目錄路徑。同檔案、不同空間的兩個檔案名稱必須相同。

2. 呼叫外連檔案的語法如下:

$.link("檔案名稱");
藍色字串只需要填入檔名即可,不需要填入路徑。以下舉實例說明──

Blogger 相關文章 V2」原本呼叫外連 js 檔的內容為 Q~V 行:

(function () {
var url = "https://googledrive.com/host/0BykclfTTti-0SlU3SDg5RUVtNlk/related-post-2-140516-min.js",
script = document.createElement("script");
script.src = url;
document.documentElement.firstChild.appendChild(script);
} )();


呼叫的方法為,將以上所有內容改為以下語法:

$.link("related-post-2-140516-min.js")




五、進階使用方法


這部分提供給進階使用者,如果外連 js 執行結束後,需要執行 callback 動作,可加上 callback 函數,使用方法為──

$.link("檔案名稱", callback);

或是你也可以直接將 callback 函數內容當成參數傳送──

$.link("檔案名稱", function(){ // 執行動作寫在這裡 });



六、優點總結


裝了這個工具後,我們的部落格就成了伺服器等級的網站,就像無預警斷電時還有備用 UPS 可支援。簡單總結一下其優點:

1. 不怕流量被限制:當主要空間達到一日的流量上限後,這個工具會自動切換,改讀取次要空間相同檔名的檔案。

2. 不擔心伺服器不穩:有時瞬間連線人數過多時,雲端空間伺服器可能會不穩、或暫時限制某些檔案的讀取。同第 1 點,遇到這些狀況時,這個工具會自動切換,改讀取次要空間相同檔名的檔案。

3. 管理方便:以往如果換了外連空間,更改範本中所有外連路徑是一件痛苦的事。使用這個工具後,只需要更改資料夾路徑的設定,所有檔案都可無痛轉移陣地。

4. 切換彈性:若哪天主要空間忽然變得龜速,想要改用次要空間,那麼就把 F、G 行的主要、次要資料夾路徑互換,幾秒鐘就完成這件事。

相信經由以上幾點說明,可瞭解這個小工具的威力。花一點時間來修改各處連結,外連空間將不再成為站長的頭痛問題。


Google Drive 相關文章:
0 0
如這篇文章對你有幫助,歡迎「分享」到 FB、「追蹤」粉絲團、「訂閱」最新文章
TOP