我想要自己也可以玩，所以不想玩恐怖的...

最近突然看到很多形形色色的解謎遊戲網站，可能是 AI 很方便，大家更容易把自己的想法做出成果。有天在我跟朋友分享一個我不敢自己玩的微恐怖解謎網站遊戲後，朋友推給我另一個適合我自己玩不恐怖的，它是 溪埕國民小學失蹤事件 ，我第一個反應是：「ㄟ？這次網址不是 xxx.github.io 了🤣 來玩一下好了！」

我的解題過程 ( 有劇透，所以建議想要有遊戲體驗的先不要看！ )

話雖如此，但我還是覺得我的遊戲體驗也不多？應該說我覺得我沒有很融入故事的內容🫠 即便看過很多類似的網站，但是這個算是我第一個認真想要解的，可能之後想要跟朋友炫耀吧... 言歸正傳，一開始最大的難題就是：我根本不知道怎麼樣算開始怎麼樣算結束！只是感覺像是要找到這個網站背後想要闡述的故事？然後可能會有一個「最終之地」代表我結束遊戲或通關之類的？總之，我就以這種什麼都不懂的狀態開始亂逛網頁了👍

整體網頁是傳統的網頁，連結多到有點想要直接寫個爬蟲開始掃，但是我先用我直覺點了 留言板 ，好巧不巧就看到了一行「 1742 本留言暫不顯示」。再用直覺看了 page source ，誤打誤撞找到了一個神奇的路徑 /backup/0913/guestbook/1742.html ，看起來該路徑是被移到 backup 之下了。

這個網站還有一個很貼心的設計，他有一個按鈕是可以直接顯示 page source 的，不用真的知道怎麼看 page source 。

接著拼接剛剛找到的路徑可以得到以下這個網址和這個網址給我的資訊：

https://www.hces.edu.tw.solve.quest/backup/0913/guestbook/1742.html

---

pending / 1742

時間： 2003/07/04 18:02
來源： PC-OLD-03
內容： 有人在嗎
　　　 我在學校
　　　 我不知道怎麼出去

狀態： clear index / 2003-09-13

看到 PC-OLD-03 這串代號馬上就想到可能是一個老舊電腦的代號 ( 就是他字面上的意思 XD ) ，貌似有人用這個電腦名稱發出了訊息，這時候我腦中又冒出一個直覺：「要去找登記設備或者處理設備維修的地方！」於是我順著內部連結找到了 校園設備報修紀錄 ，裡面有很多類似 PC-OLD-03 取名方式的電腦名稱，我就慢慢找之後在 第 7 頁 找到 PC-OLD-03 ，點進去之後發現 /equipment/PC-OLD-03.html 這個路徑，就又可以組合出以下路徑來探索，並且看到以下訊息：

https://www.hces.edu.tw.solve.quest/equipment/PC-OLD-03.html

---

403 Forbidden.

PC-OLD-03.html set hidden 2003/09/13 18:44

沒什麼頭緒，一樣翻一下 page source 後又發現另一個神祕路徑... 這時候應該不用多說了，就是進去看看，又發現另一個神祕路徑... 就這樣一直下去... 總之「尋寶過程」如下，最後會走到所謂的「最終之地」：

🖥️ 設備頁
   /backup/0913/device/PC-OLD-03.html
        ⬇️ 底部藏著下一個路徑
🔍 搜尋紀錄
   /backup/0913/searchlog/PC-OLD-03.html
        ⬇️ 最後一行又留了一個
🖨️ 列印預覽
   /backup/0913/print/PC-OLD-03/0709.html

https://www.hces.edu.tw.solve.quest/backup/0913/print/PC-OLD-03/0709.html

---

PC-OLD-03 / print preview / 2003-07-09 06:28
姓名：許雅雯
班級：三年級
聯絡方式：媽媽

我想回家

mail server unreachable

想回家的人就是三年級的 許雅雯 ！

最後的最後會看到 網站給的完整故事 ，可能是拿來核對答案和解題過程的，我看到答案後才發現我好像直接跳過了大部分的故事？甚至可能也忽略了求救的部分只專注在找主機名稱？這導致最後我雖然還是走到了最終頁面但是感覺很空虛，覺得還沒玩到遊戲就結束了🫠🫠🫠

還沒完！

在看完第 1 個故事的真相後可以跳到下一部！

本來想說先來看看我漏掉了甚麼故事脈絡，但看到還沒解完全部就想要繼續解 🤣

我的解題過程 2

這題名稱叫做「溪埕國民小學六年乙班」，一開始會看到一個聯絡簿畫面，裡面有一組字串 happyland92 不確定是甚麼訊息，但是猜測可能是一些通關密語？光看圖片沒看到其他看起來有趣的線索了，所以就回去翻 學校網頁 。

因為題目有說是六年乙班，所以我直覺就是去 九十二學年度班級網頁 找更多線索，有看到六年乙班，並且該班級對應到的網址是 ...6b... ，看起來 6b 應該就是六乙的意思吧？點進去六年乙班後剛好會看到一個登入頁面，把剛剛拿到的資訊當成帳密試試看：

6b
happyland92

結果就成功登入六年乙班的班網了！

接下來由於真的不知道從何開始，我就開始漫長的到處點點看的過程，過程中我有發現 生活札記 是需要密碼的，但目前還是沒有甚麼頭緒。

後來翻到 作品欣賞 有發現可以看到某些人零碎的生活札記。老實說，就算是零碎的還是有夠多，有點懶得一直翻，但又苦於目前還沒有什麼其他有用的線索... 真的就只能硬著頭皮翻... 找找看有沒有類似密碼、暗號的東西隱藏在內文？

在 作品欣賞 裡面翻找了一段時間之後，我發現了一篇 去看國中 的優良生活札記 ( 內文的題目是「明年的我」 ) ，他裡面有提到生日，看到生日我就在想該不會跟密碼有關？於是開始推理作者確切的生日，文中有提到事件發生在 上星期六 ，並且此札記的撰寫日期是 2003/11/13 ，直接查 2003/11/13 可以知道當天是星期四，那這樣就代表以當天來看上星期六是 2003/11/8 ，這樣一來我們知道他的生日了，並且可以知道作者是 張雅玲 ，再從 我們這一班 可以知道張雅玲的學號是 20 。

從生日可以猜各種組合的密碼比方說：

2003/11/8
20031108
921108
1108
...

我後來用 1108 順利進入了張雅玲的生活札記頁面，跟前面一樣開始漫長的探索，看了很久想到的線索可能也只是 12/25 的時候張雅玲的嬤嬤好像身體不舒服沒去上班？ 12/26 也沒有甚麼特別的，只是張雅玲在等他媽媽？欸不對！好多篇都有提到他媽媽不舒服！可能是線索？

由於我知道札記的日期，所以就開始以日期為線索繼續搜查網站，我這時候很好奇 12/26 張雅玲到底有沒有回到家，所以就找各種 12/26 相關的線索，我後來在 本週功課 裡面的 第 18 週聯絡事項 ( 12/22 ~ 12/26 ) 找到關於張雅玲 12/26 的事項的處理情形，他被標記成 另計 。

進入「另計」，有帳密，先猜用學號生日，結果直接過了...

20
1108

看到內容後點選 家屬回覆補記 ，就看到了令人難過的內容... 並且遊戲結束... 🙁

🙁

看到是難過的故事有點沖淡了我解完題的快樂感...

後記

在解題過程中我還有一些有趣的小發現，我有觀察到這個網頁連顯示方式都讓人覺得有點老老慢慢的，後來發現是一支 slow-stream-sw.js 在模擬這種「慢」 XD

接下來就來解析它，看看他是怎麼做到「慢」。

可以看到 source code 裡面有這段 pattern ：

var pattern = /<\/(?:tr|p|div|table|form|center|body|html)>/ig;

順著整個 code 的邏輯，它會去找 </tr> 、 </p> 、 </div> 、 </table> 、 </form> 、 </center> 、 </body> 和 </html> 這幾種閉合標籤，每找到一個，就在它的後面切一刀。

以留言板為例，它的原始碼大致長這樣，每一列留言是一個 <tr> ：

<table class="news-table">
  <tr>
    <td width="80">1750</td>
    <td width="120">阿芬</td>
    <td>午餐不要浪費 :)</td>
  </tr>
  <tr>
    <td width="80">1751</td>
    <td width="120">六乙</td>
    <td>我們班借書第一名嗎</td>
  </tr>
</table>

這個 pattern 掃過去，會切成：

第 1 塊：<table class="news-table">
          <tr>
            <td width="80">1750</td>
            <td width="120">阿芬</td>
            <td>午餐不要浪費 :)</td>
          </tr>

第 2 塊：  <tr>
            <td width="80">1751</td>
            <td width="120">六乙</td>
            <td>我們班借書第一名嗎</td>
          </tr>

第 3 塊：</table>

所以我們可以看到留言板載入時，是一批一批冒出來的 ( 程式會先把好幾塊湊成一批再送 ) ！每批送出中間加上延遲就是我們看到的停頓！

真正負責「一批批送、中間停頓」的是這段：

// 開頭前幾塊立刻送出，讓畫面馬上有反應。
for (i = 0; i < initialCount; i++) {
  controller.enqueue(encoder.encode(chunks[i]));
}

// 之後每一塊，送出前都先停頓一下再送。
for (i = initialCount; i < chunks.length; i++) {
  if (Math.random() < 0.12) {
    await wait(randomBetween(300, 620)); // 約 12% 機率：卡頓半秒
  } else {
    await wait(randomBetween(55, 175));  // 約 88% 機率：小停一下
  }
  controller.enqueue(encoder.encode(chunks[i]));
}

可以從上面的註解理解到大約有 12% 的機會卡頓半秒，其他 88% 都是微小停頓，這樣看下來就會知道為什麼 這個地方 會看起來卡卡的了 🫠

就這樣吧～ 希望這是一篇有趣的小整理～