socket 是什麼概念阿...

vue node.js socket

ofcourse448 2020-10-05 07:13:00 ‧ 3102 瀏覽

分享至

大佬們請教一下

只有寫過幾個月的的前端經驗

之前都是用VUE把資料從前台透過API餵給後端不然就是設時間透過API跟後端要資料

實在不知道socket是怎樣的運作原理

因為我想寫一個即時的聊天室像Messager 那樣子1對1的小功能

看了下面文章
https://blog.gtwang.org/programming/socket-io-node-js-realtime-app/

只有得出一個感覺是用NodeJs 寫成API 然後透過socket.io 吐給前端嗎?

但還是搞不太懂前台要怎麼知道伺服器吐東西給我啊(如果聊天室對方發訊息寫進資料庫再傳給我) 我又沒有伸手去拿?XD

看更多先前的討論...收起先前的討論...

froce iT邦大師 1 級 ‧ 2020-10-05 07:56:43 檢舉

1.你說的是websocket不是socket，這兩種技術不完全一樣。
2.相同的點是這兩種都是長連接，不像HTTP 一樣吐完資料就斷掉連接，所以可以做到不斷吐資料給雙方。
3.依照這種特性我們可以輕易的做到聊天室或其他即時應用（像push message給使用者）

fillano iT邦超人 1 級 ‧ 2020-10-05 09:59:06 檢舉

https://developer.mozilla.org/en-US/docs/Web/API/WebSocket/message_event

伺服器送資料，瀏覽器會觸發這個事件，所以你知道你收到資料了。html5制訂的幾種communication相關規格，都有這個事件。

ofcourse448 iT邦新手 5 級 ‧ 2020-10-05 14:54:41 檢舉

謝謝二位大佬那我大概知道方向了

bizpro iT邦大師 1 級 ‧ 2020-10-05 22:10:26 檢舉

Websocket是以半雙工HTTP協定進行TCP握手後, 脫離HTTP升級到全雙工Websocket協定, 建立模擬socket連線. 客戶端不限於瀏覽器.

socket.io是nodejs的Javascript套件, 以半雙工HTTP協定進行TCP握手後建立HTTP連線, 發出三個xhr請求(也就是JQuery的AJAX), 如果瀏覽器支援Websocket, 則升級到Websocket協定建立全雙工的Websocket連線, 如果瀏覽器不支援Websocket, 就不會升級.

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

㊣浩瀚星空㊣

iT邦大神 1 級 ‧ 2020-10-05 10:00:52

最佳解答

我用比較情境式的說法。

一般你知道的api。
就像你在丟石頭給對方。對方會依照你給的石頭大小，痛的程度，再丟給你更大的石頭或是拳頭。

而 websocket 則是你丟了一條像皮筋給對方。對方接受了就會綁在他的身上陪你玩。
你可以轉身不需要理他。反正他有事就會拉你或是彈你。你就知道了。
等到他覺得你很無趣，或是你覺得他很煩了。就會放開了。

回應 8
分享
檢舉

看更多先前的回應...收起先前的回應...

qwer2561 iT邦研究生 5 級 ‧ 2020-10-05 10:15:20 檢舉

精闢的比喻!!

ofcourse448 iT邦新手 5 級 ‧ 2020-10-05 14:54:10 檢舉

=..= 這感覺是大師級的領悟

阿展展展 iT邦好手 1 級 ‧ 2020-10-05 23:11:58 檢舉

你是不是在想壞壞的事

Ginochang iT邦新手 5 級 ‧ 2020-10-06 18:18:20 檢舉

阿展展展靠夭被你逗笑了...

utap2001 iT邦新手 5 級 ‧ 2020-10-06 19:02:55 檢舉

看完大師開示之後好像領悟了，真正會教的老師應該是要用白話文讓人了解，所以我很怕碰到一直講術語的人
之前學物件跟類別也是搞好久，後來真的碰到會教的老師才學會
我沒有開發過socket相關的套件，不過如果以我的推測，api應該是像提供函式或接口，socket就像功能更廣泛的ajax，一種前後端溝通，或是window到web傳送資料的一種界面