瀏覽器對於 Web Serial API 跟 Web Bluetooth API 都有比較高的安全性限制，其中一個就是只能在 HTTPS 網站上使用，所以在本地開發時，我們需要想辦法讓我們的網頁執行在 HTTPS 伺服器上，以便我們可以直接在本地進行開發，增加我們的開發者體驗。
mkcert 是一個可以快速幫本地的開發用伺服器建立 HTTPS 憑證的工具，這個工具的原理是建立一個 CA (Certificate Authority)，並且在本機設定成信任這個 CA，然後透過這個 CA 來簽署開發用伺服器的 HTTPS 憑證，最後再把 HTTPS 的憑證設定到伺服器上面即可。
每台電腦只需要安裝一次 mkcert，可以直接按照官方教學的安裝指令安裝，在此不多加贅述。
安裝完成後，筆者有把這個專案的 mkcert 指令寫在 package.json 內，直接執行 yarn mkcert 即可產生這個專案的 HTTPS 憑證並放到指定的路徑。
筆者在 dev.ts 內有寫一個簡單的 HTTPS 伺服器，這個檔案會需要環境變數，所以你會需要先把 .env.example 複製到 .env，然後修改一下內容。
環境變數設定完成後，可以透過 yarn dev 來執行這個 HTTPS 伺服器。
筆者有特別幫這個專案設定 livereload，這個套件的用途就是檔案有修改的時候，會自動重新整理網頁，省掉我們在開發時需要一直手動重新整理網頁的動作。
iThome鐵人賽
看影片追技術