一場大小寫轉換的客服遊戲

蟲探理查
8分鐘風格

我的部落格網站是架在 netlify 的雲端服務上,前一陣子有一個奇怪的 bug 會造成網站無法發佈更新,這個 bug 只會在 netlify 上發生,在我自己的 mac 電腦上是不會發生的,在 netlify 上面的錯誤訊息是長這副德行:

錯誤訊息
錯誤訊息

而且怪的是,這個錯誤不是總是發生,9 次錯誤可能會有 1 次沒錯誤,找 bug 找老半天找不到,後來沒辦法,就上 netlify 的 forum 去發問。

大約隔天,有人提供了一個人與人的連結,咦?我指的是「討論串的連結」才對。總之,他認為我的錯誤訊息和這個討論串提到的錯誤訊息有點像,建議我試試討論串裡的建議,修改引用的函式庫版本,也就是修改 package.json 檔案。

我點了連結去看了討論串之後,判斷我的錯誤和引用的函式庫版本應該是無關的,不過討論串裡面有一個人,他的檔案裡面把 Layout.js 改成 layout.js 就解決了,雖然對討論串其它人用這個方法沒有用,但這個方法引起我的興趣,我就沿這條線索往下挖。

case sensitivity

挖掘的過程就先跳過,總之最後破案了,原因在於不管 mac 或是 Windows 預設都是 case insensitive (檔名不分大小寫),舉例來說,你的檔案名稱存成 seo 或是 Seo 都會被認為是相同的,所以在自己的系統裡面,你程式碼寫引入 Seo 這個檔案,實際的檔案名稱叫作 seo,在 build 階段可能都不會發生問題,但是丟到 netlify 上就會出問題了。

netlify 在建立網站的時候是用 Linux 的系統,Linux 或是 Unix 這種系統或是 Github 這種儲存原始碼的平台上預設都是 case sensitive (檔名區分大小寫),也就是 seoSeo 會被認為是不同的檔案,同一個地方可以同時存在 seoSeo 兩個只有大小寫不同的檔案,而這在 mac 和 Windows 的世界中不會有 seoSeo 在同時存在的事情。

所以在 netlify 上,如果程式碼是寫 我要匯入 Seo 這個檔案,結果檔名是 seo 這就會出錯錯,而相同程式碼在你自己的 mac 或 Windows 底下,很可能是沒問題的。

不容易發生也不容易找到的原因

這個 bug 說開了其實很明顯,應該很容易發生也很容易找到才對?但是如同文章一開始的錯誤訊息來看,其實看不太出來是這個問題,去 google 也 google 不太出來是這個問題,甚至詭異的是,有時候竟然不會出現錯誤。

另外一個不容易找到原因的理由在於,這問題和解決方法不在 netlify,而是在 Git 和 Github 上。因為 Github 上程式碼和檔名不一致,而 netlify 是同步 Github 的程式碼,所以才會發生 netlify 的錯誤。

雖然 Git 預設是 case insensitive,在一般的情況下不太會發生我上面說的,deploy 到 netlify 上出現程式碼和檔名不對應的事情。假如你一開始檔名就存 Seo ,Github 和 netlify 上面檔名也會是 Seo,也就是說對於第一次建立的檔案,所有的系統都是能正常辨別大小寫的。

但是,在一個特殊情況下會發生錯誤,那就是你在本地端已經先存在 seo 這個檔案,而且已經上傳到 Github 和 netlify 了,然後你本地再把檔名改成 Seo 再上傳到 Github 和 netlify,有已經存在的檔案進行這樣大、小寫檔名的修改,才會出錯。

因為你的 OS 是 case insensitive,在 seoSeo 的時候不會告訴 Git 檔名改變,你的 Git 和 Netlify 上的檔名不會改變,而上面的程式碼有改變,所以 bug 就發生了。

有一個要注意的地方,Git 在你的機器上通常也是預設 case insensitive,我看到 stack overflow 上有人建議把 Git 設成 case sensitive,用命令 git config --local core.ignorecase false 就可以讓 Git 記得檔名大、小寫改變,但這是個錯誤的建議,並無法解決上面的錯誤。

在 case insensitive 的 files system 中把 Git 設成 case sensitive 的話會出現奇怪的情況,例如,當你在本地把 seo 改成 Seo 的時候,你打 git status 會看到 +Seo,而不會看到 -seo,代表在 Github 上會同時出現 seoSeo 兩個檔案,可見這個設定無法解決 Git 預設 case insensitive 會出現的錯誤。

如何解決

不常發生不代表不會發生,如果發生了怎麼解決,可以依照這篇的說明,有兩個方法:

方法1:

    git mv -f seo Seo

方法2:

  1. 把名字從 seo 改成 SSS
  2. commit
  3. SSS 再改成 Seo
  4. 再 commit

客戶服務遊戲化

不過,解決這個問題的過程最引起我興趣的反而是另一件事,netlify 其實不提供我這種免費會員客戶服務的,但在他們的論壇發問,很可能會有官方技術人員在論壇上提供建議,我是為了解決我網站的這個 bug 才註冊。

因為我第一次發文,我的等級和權限都很小,所以發問的時候無法上傳 2 張以上的圖。接著做一些事情就會得到一些徽章,例如:第一次用 Emoji、第一次提到某人、連續三天進論壇…等。總之系統會有機器人不斷的給你回饋,鼓勵你做好發問和回答問題,然後你的等級也會因此不斷上升,等級上升後就獲得新權力可以做更進階的事情,整個過程有點像打遊戲一樣,還蠻有趣的。

hillary 感謝我解決問題後有回來更新解決方案
hillary 感謝我解決問題後有回來更新解決方案

我覺得這樣的系統鼓勵了大家分享發現的問題和解決方法,可以讓 netlify 客戶遇到問題的時候,較容易直接在他們的論壇找到答案,而且可以大大減少 netlify 客服成本,這反而是這次解決問題的過程中,讓我印象最深刻的地方。我不知道,或許遊戲化在資訊界不是新鮮事,然而或許值得其它產業參考參考。

五月 17, 2021 更新