Console.chat 在瀏覽器的開發人員工具加入一個文字聊天室

趁著最近空閒時間較多，介紹一些特殊、趣味性十足的小工具吧！如果你是網站開發者，一定知道瀏覽器都會內建「開發人員工具」，也就是打開後有很多輔助開發功能，例如最常用的是檢查打開網頁時載入那些圖片、程式或檔案，這也可用於瞭解網站是否有被拖慢速度的問題，還能點選網頁中的元件，快速查看相關程式碼、CSS 等資訊，非常好用！當然開發人員工具功能不少，這只是其中幾項，那還有沒有其他的應用方式呢？

本文要介紹的「Console.chat」非常有意思，利用一段 JavaScript 程式碼將聊天室放進開發人員工具裡，就能直接在瀏覽器的控制台（Console）進行文字對話，聽起來好像沒什麼用，實際上也真的沒什麼用，不過利用指令功能文字聊天似乎已經是上個時代的事了，是有一種回到過去的感覺（好懷念早期的 Mud 啊…）。

在網站裡插入一段 Console.chat 的 JavaScript 程式就能完成，功能不多，只有設定暱稱、傳送訊息和訊息變色三種功能，之後回來可以看到其他人留下的對話紀錄，能正常顯示中文，如果想研究一下 Console.chat 是如何做到也能從 GitHub 頁面找到完整的原始碼。

網站名稱：Console.chat
網站鏈結：https://console.chat/

使用教學

STEP 1

開啟 Console.chat 網站會有簡單介紹，下方有一段 JavaScript 程式碼可以讓你將控制台聊天室功能放入任何網頁，不過在此之前，可直接從 Console.chat 網站進行測試。

STEP 2

打開瀏覽器的「開發人員工具」點選「Console」會隨即看到介紹，要啟動聊天室功能必須先輸入一段指令：cc() ，再輸入一次 cc() 就能停止載入聊天室訊息。

STEP 3

開啟 Console 聊天室，可能一開始不知道要如何使用，輸入 help() 指令會有簡單教學。

• username(“your username”) 設定你的暱稱。
• send(“your message”) 傳送你輸入的訊息。
• send(“your message”,”254cf5") 輸入色碼可改變訊息顏色。

STEP 4

實際測試一下 Console.chat 確實可以設定暱稱。

設定後就能傳送訊息，如果訊息中帶有鏈結，會在傳送出去後自動轉為超連結。

Console.chat 本身有防止訊息洗版的設計，無法連續傳送相同訊息，會跳出錯誤提示。

若要關閉聊天室，只要把網頁關閉，或是輸入 cc() 即可結束對話，瀏覽器就不會繼續載入更多訊息，目前沒有更多的功能，如果對原始碼有興趣可以前往 Console.chat 的 GitHub 頁面，能找到更多開發相關資訊。