HTML5 WebSocket学习笔记

什么是WebSocket

WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSockets可以通过浏览器和服务器之间的跨域连接来发送和接收消息,因此它是一种非常有用的通信协议。

WebSockets可以被用于实时数据传输,浏览器游戏实时更新,在线聊天等方面。

WebSocket API

WebSocket API包含以下几个重要的类和方法:

  • WebSocket:WebSocket类是用于打开和管理WebSockets连接的主类。
  • onopen:WebSocket类的onopen属性是一个回调函数,当WebSocket连接成功时运行该函数。
  • onmessage:WebSocket类的onmessage属性是一个回调函数,当客户端接收到来自服务器的消息时运行该函数。
  • send():WebSocket类的send()方法用于向服务器发送消息。
  • close():WebSocket类的close()方法用于关闭WebSocket连接。

WebSocket示例

下面是一个简单的用于向服务器发送消息并接收来自服务器的消息的WebSocket示例:

javascriptCopy Code
// 创建WebSocket连接 const websocket = new WebSocket("ws://localhost:8080"); // 当WebSocket连接成功时执行该函数 websocket.onopen = function (event) { console.log("连接已经打开"); // 向服务器发送消息 websocket.send("Hello Server!"); }; // 当接收到来自服务器的消息时执行该函数 websocket.onmessage = function (event) { console.log("接收到消息:" + event.data); }; // 当WebSocket连接关闭时执行该函数 websocket.onclose = function (event) { console.log("连接已关闭"); };

在上面的示例中,我们创建了一个WebSocket对象,并指定了要连接的服务器地址。当连接成功时,我们向服务器发送一条消息。当我们接收到来自服务器的消息时,会在控制台输出该消息。最后,当连接被关闭时,我们也会在控制台输出相应的消息。

总结

WebSockets是一种非常有用的通信协议,可以用于实时数据传输,浏览器游戏实时更新,在线聊天等方面。通过WebSocket API,我们可以轻松地打开和管理WebSockets连接,并向服务器发送和接收消息。