建立 AWS CloudFront CDN 源站指向 GCP GCS 小記
先來講一下為何會有這個測試 :)
日前 GCP 的 Cloud CDN 對於 Custom Origins 發佈 GA, Cloud CDN 正式可以指向外部資源, 所以就進行相關測試
我們 CDN 服務有啟用 Query String 的功能
CDN在源站的設置上面, 一般會有兩種類型
- Web Service ( 例如 nginx / apache2 )
- Bucket ( 例如 S3 / GCS )
在 AWS CloudFront 服務上面, 不管後面接的是 Web Server 還是 S3, 都是可以使用 Query String 功能的.
但是在 GCP Cloud CDN 部分, 如果後端是接 GCS, 那 Query String 功能是不支援的
- 網路上找了一下資訊, 原本好像可以支援但是後來 Google 就不支援 storage bucket 啟用 Query String
所以就嘗試看看 AWS CloudFront 的源站指向 GCP GCS, 是否可以提供服務然後啟用 Query String 功能
架構想法如下
首先來建立 GCS
點選 Storage -- > 瀏覽器
點選 建立值區
輸入 Bucket 名稱
輸入 儲存位置
- 這邊我是爲了節費, 使用單一 Region 然後選 asia-east-1
- 這邊要注意地區, 因為預設不一定是臺灣
點選 建立
接下來建立 Load Balance
點選 網路服務 -- > 負載平衡
點選 建立負載平衡器
點選 HTTP(S) 負載平衡的 啟動設定
因為不是內部的 Load Balance
所以用預設值 “從網際網路到我的 VM”
點選 繼續
接下來進行相關設定
輸入 Load Balance 名稱
進行後端設定
點選 後端設定 -- > 下拉 建立或選擇後端服務與後端值區
點選 後端 Bucket -- > 點選 建立後端 Bucket
輸入後端 Bucket 名稱
點選瀏覽 -- > 選取剛剛建立的 GCS Bucket
點選 建立
建立完成之後, 主機與路徑規則自動會進行設定
接下來進行前端設定
點選 前端設定
輸入 名稱
通訊協定按照預設 HTTP
點選完成
點選建立
點選建立好的 cf-to-gcs 負載平衡
確認 Load Balance 的 IP
補充一下, 之前碰到的奇怪狀況
之前有碰到建立 Load Balance 的時候, 不知爲何地區變成美國, 所以跟後面的 GCS Bucket 在不同的 Region 而產生錯誤, 所以也順便確認一下地區是 全域
- 錯誤訊息會是 RegionMismatch
GCP 這邊算是準備完成
接下來在 DNS 代管服務上面設定一個 A Record 指向 GCP Load Balance IP
我這邊是使用 Gandi 的服務為例
接下來處理 AWS CloudFront
登入 AWS console
點選 服務 -- > 搜尋 CloudFront
進入 CloudFront 頁面
點選 建立分佈
點選 Web 的 入門
進行相關設定
源網域名稱: 輸入剛剛的 cdnlab.sakana.tw
- 這個 DNS 名稱 會指向後端的 GCP Load Balance 然後指向後端的 GCS Bucket
查詢字串轉發與快取 (Query String) 部分
下拉選單, 選取轉發所有, 根據所有快取
分佈設定的部分
備用網域名稱(CNAME): 輸入自訂網域名稱
- 自訂網域憑證要先匯入到 ACM, 可以參考之前的文章 http://sakananote2.blogspot.com/2020/04/aws-acm-aws-certificate-manager.html
點選 建立分佈
觀察分佈的網域名稱
建立分佈需要一點時間, 可以觀察分佈的狀態來確認
在 DNS 代管服務上面設定一個 CNAME Record 指向 AWS CloudFront 分佈網域名稱
我這邊是使用 Gandi 的服務為例
接下來進行相關測試
回到 GCP Console
點選 Storage -- > 點選 瀏覽器
點選剛剛建立的 Bucket
點選 上傳檔案
選取一張圖片進行上傳
還沒調整權限前, 可以先嘗試存取圖片
在瀏覽器輸入
會得到 AccessDenied 的錯誤訊息
接下來調整 bucket 權限
- 因爲應該不會想要一個一個物件設定吧 :)
在剛剛的 Bucket
點選 權限 -- > 新增成員
新增成員: 輸入 allUsers
角色: 選取 儲存空間物件檢視者
點選 儲存
會出現確定要將資源設爲公開的警告
點選 允許公開存取
然後也會注意到 Bucket name 下面會出現公開的圖示
再次測試
在瀏覽器輸入
順便按下 F12 觀察
- 會觀察到 X-Cache: Miss from cloudfront
第一次CDN沒有圖片, 所以會是 MISS, 會去跟源站抓
按下 F5 或是重新整理
觀察資訊
- 這個時候會看到 Hit from cloudfront
- 代表這張圖片是從 cloudfront 出的, 而非源站
接下來測試 Query String 功能
回到 bucket , 但是上傳不同的圖片, 但是檔案名稱保持爲 opensusetaiwan.png
再次測試
在瀏覽器輸入
- 這邊會觀察到還是舊的圖片, 因為之前已經被 CDN 給 Hit 了
- 除非去清除圖片快取或是有效時間到, 不然都會是舊圖
在瀏覽器輸入
- 這邊更換 t=2020050902
- 因為Query String 不一樣, 我們又有設定 Query String 功能, 所以就會看到是新的圖片
- X-Cache: Miss from cloudfront
這樣也算是完成此次的測試
~ enjoy it
Reference
沒有留言:
張貼留言