Azure Front Door 擋路了

加了 Azure front door 的副作用 - API request failed

前因

我們開發了一個網站，僅建置一台服務器(台灣習慣叫做伺服器)放在 Azure HK。但是我們的客戶是遍佈全球的，所以根據地延遲時間，US、DE的使用者就會抱怨我們的產品很慢。

為了解決這個問題，我們的營運長找到了一個相對省錢又快速有效的解決方案 - Azure Front door

Azure Front door 運作原理就不談了，先講講我們家的系統。

系統架構

前端用 Angular 開發，運行在 Nginx server 上；後端有兩台，一台 Business server 用 Spring framework ，還有一台 Chat server 用 vert.x。

尚未使用 Front door

當 Client 使用系統的時候，HTTP Request 會發送到 Nginx ，再根據 API path ，轉發給 Chat server 或 Business server。

後果

有句話說，「上帝為你關了一扇門，必為你開啟另一扇窗」，這句話我還不能理解。但是當我們發現套用 Front door 之後，很多扇窗也被關了起來，哦～我懂了，原來每個人可以獲得的開口數量是有限的 XD

掛上 Front door 發現的問題如下

不支援 WebSocket 

我們 Chat Server 在即時通訊的部分，採用 WebSocket 連線，但是 Front Door 不支援。

解決方法

我們發現有些 API request 不會發到 back-end server。
**  這些 API request 來自 vert.x，我們沒設定 cache-control
**  Front door 沒設定 cache-control，預設為 1~3 天隨機設定
=> 將這些 API 設定 cache-control: no-cache, no-store, must-revalidate, max-age=0

* 我們發現某次 deployment 之後，部分頁面就是無法進入，無論是不是用無痕模式。但是不要透過 Front door 的直接連線就能進入
** 前端用 Angular。預設 index.html 沒有設定cache
=> 在 Nginx 設定 index.html no-cache, clear front-door cache