[JS] detect network connect status 當我們在開發網站時，可能會遇到需要偵測網路情況，給予使用者是當的反饋。例如做檔案上傳時，如果網路斷線又回復連接時，需要提醒使用者可以做續傳的動作。目前市面上多樣的瀏覽器所提供的online/offline事件，可能沒有辦法有效的偵測到。 :::warning It is important to note that this event and attribute are inherently unreliable. A computer can be connected to a network without having Internet access. ::: 目前各家瀏覽器針對 “Offline” 的定義都不相同，所以沒有一個有效率的方式可偵測瀏覽器的網路情況。斷線的定義位於broswer當電腦在受保護的私人網路下，所以沒有連線到外界網路的能力，要定義為Offline嗎？ 都沒接上網路但是client和server端都在127.0.0.1網段，可以互相溝通要算有網路嗎？ 一般開發網站時可能比較需要偵測連線到外埠網路的情況，所以下面是一斷偵測網路連線狀態的 example code。藉由嘗試存取自己網站的favicon.ico去判定對是否有網路的連線能力，我們透過 httprequest 的 HEADER method 去嘗試，再這個 method 下比較節省流量。HTTP Method :::warning The HEAD method asks for a response identical to that of a GET request, but without the response body ::: export function doesConnectionExist() { return new Promise((resolve) => { const xhr = new XMLHttpRequest(); const url = 'https://example.

說明 為了加速開發的效率，開發過程中不會想要每次都佈署到AWS做測試或開發。Serverless offline套件可以解決這件事情。透過模擬 AWS λ and API Gateway ，開發者在本機端就可以run一個的server去模擬再AWS服務的情況。 前置作業 需要事先安裝過 serverless package sudo npm install serverless -g 安裝serverless offline套件 npm install serverless-offline --save-dev 使用方法 在原本專案的serverless.yml上添加程式碼 plugins plugins: - serverless-offline server conf 將server在 3000 PORT 開啟; 開放所有的 IP 都可以存取 custom: serverless-offline: host: "0.0.0.0" port: 3000 在Terminal上啟動 serverless offline server serverless offline start 接著就可以用各種工具去發出request做開發測試 :::danger 執行API request出現錯誤 { "statusCode": 400, "error": "Bad Request", "message": "Invalid cookie value" } 經過測試，如果將IP綁在127.0.0.1或是沒有設定(系統預設為localhost)的話會出現access error，這個問題只要將 IP 綁在 0.