今天的事件
是發生在使用者輸入身分證時
驗證失敗的問題
答案的真相
往往就在眼前

這一天從客服那邊收到回報
使用者輸入的身分證字號
過不了驗證
附上螢幕截圖
甚至還有身分證的照片

天知地知你知我知
台灣的身分證字號
就是一個英文大寫字母
加上9個數字

看截圖的身分證字號沒什麼問題
我照著打,API驗證成功
資料也有寫進資料庫
但客戶的截圖就放在那邊
血淋淋的紅字顯示驗證錯誤

這個問題
可不是那種重開機,重登入
或是開開無痕就能解決的Bug
總不可能跟客戶說
不然你換個身分證試試看

當下想了想,會不會除了長度
還有其他檢查
看了一下後端的程式碼
竟然還真的有額外的驗證
長的大概像是這樣

但是客戶的身分證照片我也看到了
的確是這個號碼沒錯
沒道理造假身分證來唬我吧

更何況我自己輸入是OK的
再仔細看一下截圖畫面
發現輸入欄底下有紅線
表示前端驗證沒有過
(先不管為啥驗不過還要往後端送)

至此,問題的範圍
就縮小到前端的檢核
打開VSCode看一下程式碼
也就一行js的正規表達式
1個英文+9個數字

根據過往的經驗
程式的錯誤訊息有99%是正確的
只是我們沒有仔細去理解
但是一模一樣的字
為什麼我過得了驗證
客戶的截圖卻顯示不行

想到截圖
我才心裡猛地一震
難道是空白
因為空白是截不出來的

仔細看了一下前端的程式碼
沒有對字串進行trim去除空白
所以高機率是複製貼上時
不小心複製到空白
導致字數長度錯誤

速速請客服聯繫客戶
檢查是否輸入帶到空白
隔天去看資料庫
資料就進來了
表示我的推測沒錯

經過這次事件
終於了解帳密trim是在trim什麼
就是為了少一些這種神奇Bug

下回預告

新增一行js
原本的畫面就整個大error
前端的水到底有多深?

下一回
cshtml畫面壞死Bug事件