一、什么是WebSocket？
WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。WebSocket 使得客户端和服务端之间的实时数据传输成为可能。
与 HTTP 相比，WebSocket 精简、高效、快速，可以通过 JavaScript 在浏览器中直接实现即时通信。
二、 WebSocket 工作原理是什么？
WebSocket 客户端与 WebSocket 服务器建立连接，该连接始终保持开放状态。
WebSocket 使用固定的URI，该 URI 通过浏览器或应用程序发送到 WebSocket 服务器。WebSocket 服务器接收客户端请求并创建新的握手。
WebSocket 服务器通过HTTP 连接将握手响应返回到客户端，然后将连接升级到WebSocket 协议。
客户端和服务端之间的数据在连接上进行通讯。数据可以是文本或二进制数据，由发送者指定。
三、如何实现WebSocket连接?
在 JavaScript 中，使用 WebSocket API 进行创建 WebSockets 连接。WebSocket 类提供了构造功能，该功能将 WebSocket URI 作为输入。
var ws = new WebSocket("ws://localhost:8080");
一旦连接被建立，采用以下代码来发送数据：
ws.send("Hello, Server");
对 WebSockets 的每个节点（也称为 peer）进行处理的方式与同步HTTP请求相同。您可以获得事件的通知。
ws.onopen = function(){
alert("WebSocket连接已打开!");
};
ws.onmessage = function (evt) {
var received_msg = evt.data;
alert("Message is received..."+received_msg);
};
ws.onclose = function() {
alert("WebSocket已关闭!");
};
四、WebSocket 应用场景有哪些？
WebSocket 适用于需要处理实时数据的应用程序。以下是几个适合使用 WebSocket 的场合：
- 即时聊天
- 在线游戏
- 即时应用程序和控制面板
- 共享文档和文件
五、WebSocket 的优点有哪些？
- 实时性: WebSocket 是真正的实时标准。
- 更少的流量: 使用HTTP轮询需要发送更多的 HTTP 请求到服务器上，降低了系统的性能。
- 双向通信: WebSocket 支持双向通信，让服务端可以同时发送和接收数据。
- 更少的延迟: 在使用长轮询或 HTTP 流之类的传输时，由于握手时间和请求/响应延迟，数据传输速度会变慢。
六、WebSocket 的缺点有哪些？
- 浏览器兼容性问题: 一些旧版本的浏览器可能不支持 WebSocket。
- 实时性高的应用场合较多： 对服务器的负载压力较大。
- 在使用安全传输（TLS/SSL）时，服务器的性能会降低。
七、完整的代码示例
JavaScript 实现WebSocket连接：
var ws = new WebSocket("ws://localhost:8080");
ws.onopen = function() {
ws.send("Hello, Server!");
};
ws.onmessage = function (evt) {
var received_msg = evt.data;
console.log("Message is received... "+received_msg);
};
ws.onclose = function() {
console.log("WebSocket is closed...");
};
Python 实现 WebSocket 服务器：
import asyncio
import websockets
async def echo(websocket, path):
async for message in websocket:
await websocket.send(message)
start_server = websockets.serve(echo, "localhost", 8765)
asyncio.get_event_loop().run_until_complete(start_server)
asyncio.get_event_loop().run_forever()
HTML5 的 WebSockets 使用示例:
WebSocket Example var socket = new WebSocket("ws://localhost:8080"); socket.onopen = function() { document.getElementById("status").innerHTML = "Connection Open"; socket.send("Hello, Server!"); }; socket.onmessage = function(evt) { document.getElementById("message").innerHTML = evt.data; }; socket.onclose = function() { document.getElementById("status").innerHTML = "Connection Closed"; }; function sendMessage() { var message = document.getElementById("text").value; socket.send(message); }WebSocket Example
Connection Closed
原创文章，作者：UGVX，如若转载，请注明出处：https://www.506064.com/n/143390.html
微信扫一扫 
支付宝扫一扫 