The Will Will Web

記載著 Will 在網路世界的學習心得與技術分享

前端效能調校:使用 Partytown 將笨重的 JavaScript 放到 Web Workers 執行

前端效能調校的技法多如牛毛,但最明顯的效能殺手不外乎是 JavaScript 佔用 Main Thread 而導致頁面無法回應的狀況了。最近研究 Partytown 這個函式庫,他用了一個非常巧妙的技巧,把部分 JS 自動切換到 Web Workers 背景執行。這篇文章我就來分享如何將 Partytown 安裝到任意網站中。

... 繼續閱讀 ...

將現有 Azure App Service 網站加上 Cloudflare CDN 的注意事項

最近把我的部落格改用 Cloudflare CDN 來當作網站前級,但是在設定的過程中遭遇了一些地雷。由於我的網站是放在 Azure App Service 上面,原本的設定都相當安全,像是 HTTP to HTTPS 的設定,還有一些 URL Rewrite 的設定,多年來都相安無事,但上到 Cloudflare 的時候網站就掛掉了。這篇文章我就來說說我的研究心得!

... 繼續閱讀 ...

認識 Google Chrome 與 Microsoft Edge 的 Kiosk 模式

最近有個專案可能會需要讓網站跑在 Kiosk 模式下,雖然在 Windows 10 IoT 企業版也有內建 Kiosk 模式,但如果是一般電腦也想用 Kiosk 模式執行網站,其實也可以透過 Google Chrome 或 Microsoft Edge 輕鬆的做到。這篇文章我就來好好介紹一下這個鮮為人知的 Kiosk 模式。

... 繼續閱讀 ...

透過瀏覽器瀏覽網站時到底 URL 長度有沒有一定的限制

我們一般在規劃設計一個網站時,通常都不會特別考慮一個網頁的 URL 到底會有甚麼上限,因為一個正常人絕不會把網址設計的很長很長,對吧?但有時候我們希望把一些網頁的狀態保存在網址列上,方便用戶將網址加入書籤,下次回來時就可以看到原本的資料,這時就有可能會讓網址變的很長。這個問題每隔一段時間就會有學員提出,今天我想透過這篇文章跟大家說說這個 URL 的長度限制。

... 繼續閱讀 ...

如何使用 OpenSSL 工具產製 CSR 憑證要求檔並成功申請正式 TLS 憑證

我們公司有經銷代理 TWCA 網站伺服器憑證,每隔一段時間都會有一些死忠的客戶跟我們定期續約購買,但這個過程很多人沒有經驗,經常搞不清楚該如何申請。如果你是開發人員,透過 mkcert 建立自簽憑證完全沒有難度,但是若要申請一個正式憑證就不是很多人能清楚步驟了。這篇文章我打算來解說一個完整的憑證申請流程,讓每個人都可以輕鬆掌握。

... 繼續閱讀 ...

開發與部署網站時需注意不要使用到 ERR_UNSAFE_PORT 不安全的埠號

我昨天在授課的時候,突然遇到 Chrome 瀏覽器無法瀏覽網站的情況(ERR_UNSAFE_PORT),我踩到一個不知道算不算罕見的地雷,在深入瞭解之後,覺得有必要寫成文章提醒大家,因為你還真的很有可能會在不久的將來遇到這個問題,看完文章才不會讓你日後鬼打牆太久,讓我們繼續看下去。

... 繼續閱讀 ...

如何將一個 ASP.NET Core 網站快速加入 LINE Login 功能 (OpenID Connect)

前幾天原本想用 ASP.NET Core 寫一個最簡單的 LINE Login 範例程式出來,結果想不到這麼簡單的功能,卡關了兩天才找出解決之道。如果單純的透過 OAuth 2.0 授權流程來取得 Access Token 與 ID Token 其實還蠻簡單的。但是若希望可以做到 OpenID Connect 流程中自動透過 JWK (RFC 7517: JSON Web Key) 來驗證 Token 的有效性,這時可以直接使用 ASP.NET Core 內建的 Microsoft.AspNetCore.Authentication.OpenIdConnect 套件來完成。不過當方便的套件遇到特殊的實作時,那麼就是一場災難啦。這篇文章我打算來說說這次的踩雷之旅!

... 繼續閱讀 ...