iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

摸索 WebSocket,遠望 WebRTC 系列

原先計畫能夠將 WebSocket 和 WebRTC 都嘗試摸索一番,但在準備的過程中,發現精力和時間分配有限,因此重點仍會放在 WebSocket上,使用 Vanilla JS 來創建 Chat,或者摸索看看有沒有其他可以實作的功能。

行有餘力之下,會再嘗試加入框架的架構下,如何實作相關作品。

最後的最後,如果有幸還有力量的話,希望能涉獵到 WebRTC,期許自己完成。

鐵人鍊成 | 共 30 篇文章 | 10 人訂閱 訂閱系列文 RSS系列文 團隊血汗攻城屍
DAY 21

Day20:狀態參數判讀

在 WebSocket 中,對於是否處於連線狀態,或是連線有無成功,預設有提供參數供開發者判斷,因此可以透過 readState 來檢查。 readyState...

2021-10-06 ‧ 由 DoDoBird 分享
DAY 22

Day21:使用 ws 實作訊息傳遞

專案結構命名調整 調整部分檔案名稱,避免過於混淆。 - client - main.js -> client.js - server -...

2021-10-07 ‧ 由 DoDoBird 分享
DAY 23

Day22:ws 整合 Vue 渲染聊天訊息

前面的 socket.io 使用原生 JS 來寫 Demo,這邊就試著改用框架來處理,不過畢竟目前還是 Demo 練習性質,所以就直接用 CDN 引入,不使用...

2021-10-08 ‧ 由 DoDoBird 分享
DAY 24

Day23:進入聊天室狀態判斷

在書寫邏輯之前,先釐清程式要達成的需求是什麼? 頁面上會有兩個組件,一個是登入用,另一個則是用來顯示訊息列表。 當玩家輸入名稱後,頁面需要切換到顯示訊息列表的...

2021-10-09 ‧ 由 DoDoBird 分享
DAY 25

Day24:檢查登入人數

國慶連假中,假日只想耍廢玩 game,不想進修QQ,但為了避免斷賽,還是加減推一些東西,等明後天再來調整吧?不過也許會懶癌發作。 HTML 訊息列表頁面,新增一...

2021-10-10 ‧ 由 DoDoBird 分享
DAY 26

Day25:複數聊天室

鐵人賽寫到後面,似乎有種越來越難施力的困窘,果然要完整寫完系列筆記,除了需要先列好大綱外,還需要提前準備筆記內容,如果當天再來處理,幾乎是各種卡殼,也算是一種教...

2021-10-11 ‧ 由 DoDoBird 分享
DAY 27

Day26:優化修正

前面在寫傳送資料這一塊時,有些環節沒有思考妥當,導致問題叢生,所以這邊先進行部分重新調整。 登入和發送訊息本質都是事件,差別在於,當登入事件觸發時,必須告訴 s...

2021-10-12 ‧ 由 DoDoBird 分享
DAY 28

Day27:歪樓+卡文(全英文筆記 - I)

鐵人賽寫到現在,其實主題中的內容還有很多可以實作的部分,但一方面是不確定時間到期後,鐵人賽系列還能不能繼續發文,另一方面是很想要回頭去重新翻修前面的文章,讓整個...

2021-10-13 ‧ 由 DoDoBird 分享
DAY 29

Day28:繼續歪樓(全英文筆記 - II)

繼續昨天的歪樓筆記,昨天只有寫 webpack-dev-server, 今天來加上一些基本的插件還有如何設定。 不過寫英文筆記,雖然文法可能廢到爛,但私心的好處...

2021-10-14 ‧ 由 DoDoBird 分享
DAY 30

Day29:歪樓無極限(全英文筆記 - III)

雖然今天已經是最後一天,但如果明天系統仍然可以發文的話,會先繼續發文,方便之後回顧整理系列文時,能夠有更多的篇幅來調整。 但因為下個月又有六角的活動,也許我會想...

2021-10-15 ‧ 由 DoDoBird 分享