WebSockets與socket.io
Websocket 是一種協議,它提供了伺服器和客戶端之間的同步互相交換。在傳統情況下,客戶端向伺服器發送請求,伺服器通過返回數據來做出回應。而在 WebSockets 中,伺服器和客戶端都可以發送數據。
這是一種雙向通訊的過程。Socket.io 則是基於這個協議的一個庫,它使得使用 WebSockets 變得更加容易。
※強弱危機分析
優勢:
- node.js提供了高效能的非同步i/o處理,讓開發者能更方便地建立即時通訊應用程式。
- socket.io模組為即時通訊提供了實用且易於使用的介面,有利於複雜任務的快速開發。
- 透過node.js和socket.io建立聊天伺服器,能夠跨平台運行,包括web、ios、android等。
劣勢:
- 對於初學者來說,node.js與socket.io的學習曲線較陡峭。
- 在處理大量連接或高度計算密集型任務時,單一執行緒的node.js可能會成為性能瓶頸。
- 雖然socket.io支持各種傳輸方式,但在某些特殊情況下(例如防火牆限制),其連接可能仍會受到干擾。
機會:
- 隨著即時通訊需求日益增加,在個人化和效率上有很大的改進空間。
- 由於javascript是目前最流行且被廣泛使用的程式語言之一,所以社區資源豐富,可快速解決問題。
- 隨著5g網路的普及,即時通訊應用將大放異彩
威脅:
- 市面上已有許多成熟且功能強大的即時通訊解決方案,競爭壓力相對較大。
- 由於node.js和socket.io都是開源技術,可能會受到版權法規範或其他未預期的法律風險。
- 因為javascript在不同瀏覽器中可能存在兼容性問題,這可能影響到使用socket.io建立的聊天伺服器。
Javascript的黑手黨
Node.js 是一個 JavaScript 後端技術,它產生非同步的程式碼,並由伺服器執行,就像 PHP、Ruby 或 Python 一樣。它使用事件來達到這個目的。Node.js 還有自己的套件管理器叫做 npm,安裝、更新和刪除都很簡單。
網頁結構
我們的主要目標是建立一個簡單直觀的HTML網頁,該網頁提供了一個結構和訊息列表。我們將使用Node.js網路框架來確保安裝正確。讓我們輕鬆地通過所需的項目填充依賴項,例如:npm install –save express@4.10.2。
既然我們已經完成了express的安裝,現在可以通過創建一個index.js文件來設置我們的應用程式。
我們在這裡做了以下事情:
當使用Express初始化的HTTP伺服器提供了一個函式處理程式,網站首頁被訪問時會調用預定義的路由處理程式。我們創建了一個佔用著3000埠的HTTP伺服器監聽。當執行node index.js時,將顯示以下畫面:在您的瀏覽器中訪問https://localhost:3000時,您應該看到這個結果:
HTML編碼
直到此時,我們在index.js中的res.send後將其轉換為HTML字串。如果將整個HTML代碼放在其中,這將非常令人困惑,因為顯示方面會變得非常混亂。因此,我們將在創建index.html檔後通過它來提供服務。
為了做到這一點,讓我們使用sendFile通過路由處理程式重構:同時也執行index.html的填充操作:在進程重新啟動之後刷新頁面(運行node index後按Ctrl+C)你應該能看到類似以下的內容:
Socket.IO整合
Socket.io由兩個部分組成:Node.JS HTTP伺服器和socket.io與伺服器整合的套件,以及在瀏覽器端載入客戶端庫的socket.io-client。現在只需要安裝一個模塊,Socket.io會自動提供客戶端服務,這在開發階段非常方便:npm install –save socket.io。現在我們編輯index.js並添加後面的代碼片段,這樣一旦安裝了模塊,就可以添加package.json依賴項。
注意到我通過HTTP(HTTP伺服器)對象傳遞了另一個Socket.io示例。然後,在控制台中記錄傳入sockets連接事件。現在,在index.html中,在body結束之前加入以下代碼片段:這僅僅是載入Socket.io-client並在揭示全域io之後建立連接的相關內容。
注意到當我呼叫io()時,並沒有指定任何URL,因為它默認試圖與提供該頁面的主機建立連接。現在如果重新加載網站和伺服器,你應該會看到消息“a user connected”。當同時打開幾個選項卡時,會看到相同的消息多次:每個socket也會觸發一個奇怪的斷開事件。
現在你可以看到在多次刷新選項卡後下面的消息變化:
發射
Socket.io的主要思想是,您可以隨時接收和發送任意數量的事件,並提供所需的任何資訊。支援使用JSON編碼對象以及二進制數據。讓我們以一種方式來實現,即在用戶輸入消息時,服務器會收到一個聊天消息。
現在,在index.html部分應該突出顯示如下:而在index.js中列印的聊天消息事件如下:
廣播
最後一步是所有使用者都應該在事件被發射時從伺服器收到訊息。透過 socket 提供的 io.emit 函式可以針對每個人傳送訊息。如果某個特定的 socket 不希望成為目標,可以使用廣播旗標將其排除在發送給每個人的訊息之外。
為了簡單起見,讓我們將訊息包含在頁面中,在客戶端捕捉到後即可顯示出來。客戶端的 JavaScript 代碼如下:太棒了!只需 20 行程式碼,我們就建立了第一個聊天應用程式。
相關數據:
- 根據stack overflow 2020 年度開發者調查,全球有68.8%的受訪者表示他們使用過或正在使用node.js。 來源: stack overflow
- 另一份來自similartech 的數據顯示,全球超過 375,000 個網站正在使用socket.io技術。 來源: similartech
- 在英國,根據hackerrank的2018年報告指出,約有55%的開發者正在使用node.js建立相關程式。 來源: hackerrank
- 至於在美國,indeed.com提供的工作市場資料顯示,約有20%以上的後端開發職缺需要求職者對 node.js 和 socket.io 有所了解。 來源: indeed.com
- 日本企業中, 使用node.js和socket.io進行即時通訊開發的比例為25%,統計來源於rakuten coo hiroshi mikitani 在2019年公布之數據。 來源: rakuten
留言列表
