這幾天在研究「忘記密碼」的後端功能實作時，發現用 Nodemailer 搭配 Express 框架算是難度較低且方便維護的。這邊筆記下實作的一些細節。
內容
後端
- 1. 將 nodemailer 的核心 Instance 單獨放在一支程式碼，僅對外暴露出自行宣告的 sendEmail 方法，並接收自行傳入的 option 設定 (也就是信件的相關內容，從人員、內文到附加檔案)
- 2. 忘記密碼 controller 的邏輯有以下幾點：
- 請使用者輸入指定資料 – 通常是 email，藉由判斷資料庫中是否有該人員後，寄出忘記密碼信件
- 僅需要寄出 email，無需在寄出後自動在 DB 重設密碼，否則他人便可用此機會作亂幫他人「忘記密碼」
- 3. 忘記密碼 route 設定：
不需要進行權限綁定，畢竟使用者都忘記密碼了，根本不可能登入 - 4. Email 信件中的連結
這邊無論是帶 code, access_token …之類的值於網址的 query 內，要先跟前端進行同步確保網址解析
前端 SPA
若你是採取 SPA 前後分離的模式，可採取以下思路來將 query 換到 hash 中 ( 若用 vue-router，那麼就是在 router.beforeEach() 內執行 )
1. 在確認 email 中的網址格式後，先透過 new URL方法來進行網址解析 – 藉由讀取特定的 query key ，將 code 讀取出來的，並暫時存放於 localStorage 中
2. 緊接著透過 window.location.replace() 方法，將網址列 # 之前的網址回復到正常情況 (無 query)
3. 由於 localStorage 已經有先前自定義存下的 key ，藉由讀取這個 key 來將頁面導向「忘記密碼頁面」。在導向前，除了要將存在 localStorgage 中的值一同帶入外，同時要在導入忘記密碼頁前將 localStorage 這個暫存的值給移除
程式碼
參考資料
1. Nodemailer
2. Node.js: 使用 Nodemailer 傳送 Email
