Azure CDN 為靜態網站創建內容分發網路

一,引言

     最近剛剛接觸 Edi.Wang 的 Moonglade 部落格系統,正好這套系統中有使用到 Azure CND (內容分發網路),那就學習學習。那麼今天就嘗試利用 Azure CDN 來發布靜態網站。當然了,我們可以選擇Azure Storage Account 作為我們演示的靜態網站的載體。

什麼是 Azure CDN?

Azure CDN(內容分發網路):CDN 是伺服器的分散式網路,可以有效的將Web內容傳遞給我們,同時CDN 可以將快取的內容存儲在記錄我們比較近的POP(入網點位置)位置的邊緣伺服器,以便最大成都降低網路延遲。Azure 內容分發網路 (CDN) 可幫助減少延遲並提升高頻寬內容的性能。

二,正文

1,部署靜態網站

登陸到 Azure Portal 上,點擊 「create a resource」,搜索 「Storage」,並且創建

輸入相關參數

Resource group:「Web_Test_CDN_RG」(創建新的資源組)

Storage account name:「cdnstaticwebstorage」

Region:「East Asia」

performance:Standard

Redundancy:「Locally-redundant storage(LRS)」

點擊 「Next:Advanced>」

其他選項卡頁直接選擇默認就可以了,等待驗證完成後,點擊 「Create」

創建完成後,點擊 「Go to resource」 跳轉到該資源

回到我們創建的Storage Account 頁面後,選擇 「Settings=》Static website」,開啟靜態站點

接下來,我們需要輸入靜態站點的相關參數

Index document name(靜態站點的首頁):「index.html」

Error document name(靜態站點的錯誤頁面):「404.html」

檢查完輸入的參數後,點擊 「Save」 進行保存

創建完成後,我們可以看到 Azure 已經創建了我們靜態站點寄存的 容器 「$web」

轉到 「Blob service=》Containers」,Azure 已經自動為我們創建了兩個容器 「$logs」,「$web」

選擇 「Settings=》Properties」 找到靜態站點的url 複製出來

我們嘗試通過 web url 訪問我們靜態站點://cdnstaticwebstorage.z7.web.core.windows.net/

可以看到當前是沒有任何請求的內容,那是因我們的靜態站點是沒有任何內容的

上傳我們的演示靜態頁面

重新訪問靜態網站的 url

ok,靜態網站部署完成

2,配置 Azure CDN 加速

繼續在 Azure Portal 首頁,搜索 「CDN」,並且創建

輸入相關參數

Resource group:「Web_Test_CDN_RG」

Name:「cnbateblogweb-staticwebsite-cdn」

Region:「Global」

Pricing tier:「Standard Microsoft」

點擊 「Review + create」

等待校驗完成後,點擊 「Create」 進行創建

創建完成後,跳轉到 “cnbateblogweb-staticwebsite-cdn” 頁面,點擊 「+ Endpoint」 創建 CDN 的終結點

輸入 Endpoint 的相關資訊

Name:「cnbateblogweb-staticwebsite」

Orign type 選擇:「Storage static website」

***這裡注意一下,Origin type 是支援多種的,我們也可以選擇 「Custom orgin」,然後把 Storage static website 的 URL 貼到 Origin hostname 和 Origin host header 這個位置上

點擊 「Add」 添加操作

注意,終結點的設置可能需要差不多10分鐘才會生效,當生效之後,我們複製當前CDN 終結點 URL在瀏覽器中嘗試訪問

訪問後展示的效果

Bingo!!!成功🤣🤣🤣🤣🤣🤣🤣🤣🤣

三,結尾

     今天介紹的內容,大家可以參考 MS Learn 上的課程進行學習。下一篇我們繼續講解 Azure CDN 的其他功能,包括 動態站點加速、地理篩選、結合.NET Core Web 應用程式來分發內容網路。

參考鏈接: Azure 上的內容分發網路使用 Azure CDN 和 Blob 服務為網站創建內容分發網路

文章來自部落客本人自己的部落格://allenmasters.com/post/2021/4/25/azure-cdn

歡迎大家關注部落客的部落格://allenmasters.com/

作者:Allen 

版權:轉載請在文章明顯位置註明作者及出處。如發現錯誤,歡迎批評指正。