靜態網站也能上雲端?用Cloud Storage取代傳統VPS吧!

靜態網站也能上雲端?用Cloud Storage取代傳統VPS吧!

你的靜態網站還在使用傳統VPS嗎?其實靜態網站根本不需要主機,只要透過Google Cloud Platform(GCP)的Cloud Storage就能輕鬆管理!快來看看怎麼把網站主機遷移到雲端吧!

很多人以為公有雲是那些大企業或是高科技新創公司在用的東西,跟我的靜態小網頁沒關係,我還是跟市面上一般的主機公司買一買方案就好,反正也不是說太貴。這麼想就錯了!靜態網站根本用不到主機,搬上雲端反而更省錢。這到底是怎麼一回事?想搬的話該怎麼做?

靜態網站根本不需要主機?

由於靜態網站只是html, CSS, javascript組成的內容,本身並不需要用到server side的運算資源,因此只需要有存放檔案的「空間」,就可以讓網站被訪客以瀏覽器的方式閱覽。這也是為什麼你會常常看見虛擬主機廠商把所謂host網站用的主機稱作「網站空間」,其實只是把你家的靜態網站跟別人的靜態網站一起塞在同一台主機裡面,共用那台主機的「空間」。

那既然靜態網站只需要空間,用不到主機的運算資源,比起向坊間廠商承租虛擬主機,選擇制式方案並支付費用,不如選擇GCP的Cloud Storage,只用你需要的、只付你用到的,重點是「完全不需要任何維護與管理」,因為有Google大神在幫你做,非常適合想要設定一次就可以從此放著不管網站也不會出事的靜態網站主們!

使用GCP的Cloud Storage作為靜態網頁空間

本文的教學重點放在靜態網站存放的各項設定步驟而非GCP啟用,而且假設你已經擁有一個靜態網頁(以及網域名稱)。因此若尚未啟用GCP,可以先參考下方的條列摘要:

如果你還沒啟用GCP?該完成哪些前置作業?

  1. 申請一個GCP帳號(新用戶還有一年期的300美金試用額度可用)
  2. 建立一個GCP專案
  3. 設定帳單(綁定一張信用卡)

Cloud Storage作為靜態網頁空間的設定步驟

  1. 請你的DNS代管商為你的網域新增一項CNAME紀錄,紀錄值為c.storage.googleapis.com.(請注意最後面有一個.唷!請不要忽略它。)

  2. 建立一個Cloud Storage Bucket,這個Bucket就是你的專屬網頁空間。
    • GCP左側邊欄 > Storage > 瀏覽器 > 建立Bucket
      照片為在GCP建立一個Cloud Storage Bucket
    • 輸入Bucket的基本資訊

      • 名稱:請輸入你的網站網域名稱,例如:www.example.com.tw

      • 預設儲存空間級別:此時你會看到下面有四個選項可以選擇,但是該怎麼選擇呢?那就要先來說明一下那四個選項到底個別代表什麼意思。

        依照Bucket存放區域
        資料儲藏、備份用
        (不適合網站使用)
        Multi-regional
        Regional
        Nearline
        Coldline
        將你的bucket放在複數區域內,如果你的網站是國際性網頁就比較適合選這個 將你的bucket放在單一區域內,如果你的網站是屬於在地性質就較適合選這個 一個月可能會取用一次儲藏的資料(用於偶爾才用的資料儲藏) 一年可能只會取用一次的儲藏的資料
        (只要存放,沒事幾乎不會取用資料)
      • 基本上選擇不同的選項是會影響到費用的,如果想要了解更多不同選項的費用細節,可以直接點選畫面上的「比較儲存空間級別」,就會跳出一個視窗,上面包含選項的比較、費率等資訊,方便你評估。但其實以台灣地區的靜態網頁來說,選擇Regional就對了唷!
        照片為GCP的Bucket基本資訊 :預設儲存空間級別

        比較儲存空間級別的頁面,不但可以幫助你選擇出最合適的儲存方案,也可以即時做一些費用試算,算是滿方便的小工具。

      • 位置:也就是Bucket所在的地理區域,如果你的網頁主要是供應台灣地區的用戶瀏覽,那當然建議位置選擇「asia-east1」,也就是台灣。
      • 以上都選完之後,按下「建立」即可。
  3. 上傳靜態網站資料到Cloud Storage Bucket GCP非常好用又友善的拖拉介面,讓你可以非常輕易的把所有網站資料一口氣通通搬上去,很像我們平常在使用Google Drive或者是Dropbox那樣的感覺。更厲害的是,當你把靜態網站資料拖上去之後,它還會自動幫你按照檔案名稱、大小、檔案類型分好類,真的是太聰明了。
    照片為Cloud Storage Bucket中的拖拉資料的界面
  4. 把網站檔案設為公開把網站的檔案設為對外公開,網站才能正常的被所有來瀏覽網頁的人所瀏覽唷。設定的方式非常簡單,首先選取Bucket > 權限 > 新增成員 > 輸入「allUsers」> 給予「Storage 物件檢視者」的角色 > 新增,就完成了。
    照片為在GCP中新增Storage的成員照片為設定權限,新增成員為Storage 物件檢視者
  5. 設定索引頁(Index page)以及404頁面在Cloud Storage設定Index page跟404頁面也非常的簡單。Google的官方說明文件雖然說這不是必須要設定的,但我還是建議兩個頁面有的話都設定會比較好,尤其是Index page建議一定要設,而404 page則因為部分網站其實沒有,所以可設可不設。首先,在Bucket列表(也就是瀏覽器)的最右邊,有一個三點圖示 > 編輯網站設定,只要按照順序把頁面檔名填進去就好了,很簡單吧!
    照片設定網站索引頁,編輯網站設定照片為設定404 page
  6. 測試

    完成以上的步驟之後,就可以在瀏覽器輸入你的網址,看看是否能夠正常顯示網頁囉!

Cloud Storage是激省的靜態網頁空間

以上面選擇的規格來看,Cloud Storage的儲存費率真的是相當低廉,每月每GB只要0.023美元。但除了儲存空間的費用之外,還有網路傳輸費用,GCP的網路傳輸費率相對來說是比較貴的,但若是你的網站主要流量來源都是在台灣,且網路傳輸量每月在1TB以下,每GB的傳輸費為0.12美元。

舉一個自身實測過的landing page為例,網站每月的訪客約有1,000人、Google Analytics的session數超過5,000(有打廣告),在GCP的網路傳輸量約為1.5GB,平均每個月的帳單金額竟然不到6美元!比起坊間便宜的主機方案年費約5,000台幣到6,000台幣,真的是分分鐘都划算啊!

看完以上的介紹,是不是也很想試試看呢?雖然使用GCP要自己動手設定,但幸好步驟並不是非常複雜,不過還是需要對網站有基本的知識會比較順利。如果你的網站也是靜態網站,而且你正在尋找更便宜的網站空間,Google Cloud Storage或許是一個好選擇!

延伸閱讀

選擇GCP作為網站主機的6大好處!
Google Cloud Platform 免費300美金須考慮的風險詳解