WebSocket实时应用

在开发一些前端页面的时候,总是能接收到这样的需求:如何保持页面并实现自动更新数据呢?以往的常规做法,是前端使用定时轮询后端接口,获取响应后重新渲染前端页面,这种做法虽然能达到类似的效果,但是依然有很多缺点,缺点就不在这里说了,感兴趣的小伙伴可以自行查阅一下。现在让我们回忆一下,我们有没有想过,是否有一种技术,服务器可以主动将数据推送给客户端进行渲染,而不再是客户端向服务器发出请求等待返回结果呢?接下来,让我们一起了解weboskcet。

websocket是HTML5规范的一个部分,它借鉴了socket的思想,实现了浏览器与服务器全双工通信,达到了即时通信的效果。websocket协议基于TCP协议实现,包含初始的握手过程,以及后续的多次数据帧双向传输过程,避免服务器频繁打开多个HTTP连接,从而能更好的节省服务器资源和带宽,提高工作效率与资源利用率

websocket的通信规范,首先浏览器通过HTTP协议发出websocket的连线请求,服务器进行响应,这个过程称为握手,握手完成后,客户端和服务器之间建立一个类似TCP的连接,使用websocket协议,从而实现它们之间的通信。

客户端的简单示例

// 创建websocket

var ws = new WebSocket("ws://www.example.com");

// 连接成功时触发

ws.onopen = function(e) {

console.log("Connectiong open ...");

// 发送消息

ws.send("Hello WebSocket");

};

// 接收消息时触发

ws.onmessage = function(e) {

console.log("Received Message: " + e.data);

ws.close();

};

// 关闭连接时触发

ws.onclose = function(e) {

console.log("Connection closed");

};

// 出现错误时触发

ws.onerror = function(e) {

console.log("error");

};

服务端的简单示例

创建websocket服务端

from tornado.websocket import WebSocketHandler

class wsHandler(WebSocketHandler):

保存连接的用户,用于后续推送消息

connect_users = set()

已与客户端建立连接

def open(self):

print("开启WebSocket opened")

self.connect_users.add(self)

关闭客户端连接

def on_close(self):

self.connect_users.remove(self)

接收到消息

def on_message(self, message):

self.write_message("接收到客户端的消息:{}".format(message))

所有用户发送消息

@classmethod

def send_demand_updates(cls, message):

使用@classmethod可以使类方法在调用的时候不用进行实例化

给所有用户推送消息(此处可以根据需要,修改为给指定用户进行推送消息)

for user in cls.connect_users:

user.write_message(message)

允许WebSocket的跨域请求

def check_origin(self, origin):

return True

if name == "main":

调用

wsHandler。send_demand_updates("服务端发送给客户端的消息")

相关推荐
せいしゅん青春之我34 分钟前
【JavaEE初阶】网络原理——TCP报文结构、确认应答机制
网络·笔记·网络协议·tcp/ip·java-ee
☆璇2 小时前
【Linux】数据链路层
linux·服务器·网络
电鱼智能的电小鱼3 小时前
基于电鱼 ARM 工控机的AI视频智能分析方案:让传统监控变得更聪明
网络·arm开发·人工智能·嵌入式硬件·算法·音视频
2501_915909064 小时前
网络调试工具推荐 Fiddler抓包工具使用教程与代理设置详解(HTTP/HTTPS配置与实战技巧)
网络·http·ios·小程序·fiddler·uni-app·webview
芙蓉王真的好15 小时前
初阶吃透:HTTP 请求行的格式(Method + URL + Version)详解
网络·网络协议·http
小武~5 小时前
嵌入式网络编程深度探索:无线网络驱动开发实战指南
网络·驱动开发
我叫汪枫6 小时前
《HTTPS 的灵魂:加密、认证与数字证书》
网络协议·http·https
Rysxt_7 小时前
MQTT 与 WebSocket 对比教程:物联网与实时通信协议选择指南
物联网·websocket·网络协议
熊明才7 小时前
解决WSL2实例IP冲突:为多个WSL实例配置独立静态IP
chrome·网络协议·tcp/ip