《WebSocket：突破传统 HTTP，开启实时通信新时代》

在当今这个信息瞬息万变、交互需求日益增长的互联网时代，WebSocket 技术犹如一颗耀眼的新星，闪耀在 Web 开发的舞台之上。它以独特的优势和广泛的适用场景，为各种应用带来了全新的活力与可能。

一、WebSocket 简介

WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议。在传统 HTTP 协议下，客户端向服务器发起请求，服务器接收并返回响应，整个通信过程是单向的，且每次通信都需要建立和关闭连接，这在处理实时数据交互时显得捉襟见肘。而 WebSocket 协议则不同，它使得服务器和客户端之间能够建立起一条持久连接，双方可以在这条连接上随时发送和接收数据，无需像以往那样频繁地进行连接建立和断开操作，大大提高了通信效率，降低了延迟，为实时数据传输和互动开辟了一条绿色通道。

二、WebSocket 的使用场景

1. 实时聊天应用

   • 在各类社交平台、在线客服系统以及团队协作工具中的聊天功能，WebSocket 能够确保用户发送的消息瞬间送达对方，并且接收方的回复也能实时显示在发送方的界面上。例如，在企业内部沟通工具中，员工之间可以实时交流工作进度、分享文件和讨论问题，无需担心信息延迟导致的沟通不畅，极大地提高了工作效率和信息传递的准确性。

   • 对于游戏中的实时聊天系统，如多人在线竞技游戏中的团队语音和文字交流，WebSocket 可以让玩家之间的沟通更加顺畅、及时，增强游戏的互动性和沉浸感，仿佛身处同一物理空间进行面对面的交流。

2. 实时通知推送

   • 电商网站利用 WebSocket 及时向用户推送商品价格变动、库存告急、促销活动开始等通知。当用户浏览商品页面时，一旦商品价格发生调整或库存有限，系统能立刻通过 WebSocket 将信息推送给用户，促使用户及时做出购买决策，提高销售转化率。

   • 新闻资讯类网站和 APP 可以通过 WebSocket 实时向用户推送最新的新闻头条、突发新闻事件报道等。用户无需手动刷新页面，就能第一时间获取到最新资讯，保持对时事的紧密关注，满足用户对信息时效性的高要求。

3. 在线游戏同步

   • 在多人在线游戏中，WebSocket 是保证游戏状态同步的关键技术。例如，在一款实时战略游戏中，所有玩家的操作指令（如移动单位、发起攻击等）都需要迅速传达给服务器，并且服务器要立即将游戏的最新状态同步给每一位玩家。WebSocket 的低延迟特性确保了游戏中各个玩家的视角一致，行动能同步进行，避免了因网络延迟导致的游戏体验不佳，如角色动作不同步、战斗结果判定混乱等问题，让玩家能够享受流畅、公平的游戏过程。

4. 实时金融数据更新

   • 对于金融交易类网站和交易平台，实时、准确地获取股票行情、外汇汇率、期货价格等金融数据至关重要。WebSocket 能够与金融数据服务器建立持久连接，将这些关键数据实时推送给用户，使投资者能够根据最新市场动态做出及时的投资决策。即使在市场波动剧烈、数据更新频繁的情况下，WebSocket 也能保持稳定的数据传输，不会出现数据丢失或延迟过长等问题，为金融交易提供了可靠的数据保障。

5. 物联网（IoT）应用

   • 在智能家居系统中，通过 WebSocket 可以实现手机 APP 与各类智能设备（如智能灯、智能插座、智能摄像头等）之间的实时双向通信。用户可以随时在手机上查看设备的当前状态，并发送指令控制设备，例如远程开启或关闭灯光、调节温度等。同时，设备也可以将自身的工作状态（如电量、运行故障等）实时反馈给手机 APP，让用户及时了解设备情况并进行相应处理，增强了智能家居系统的便捷性和可控性。

   • 工业物联网场景下，WebSocket 用于实时监控生产线上的各类传感器数据（如温度、压力、湿度等）和设备运行状态。一旦有异常数据出现，可以迅速通过 WebSocket 将告警信息发送给相关管理人员，以便他们及时采取措施，避免生产事故的发生，提高生产效率和质量。

6. 实时协作编辑

   • 在线文档协作工具（如 Google Docs、石墨文档等）和代码协作平台（如 GitLab、GitHub 的某些协作功能）借助 WebSocket 实现了多人同时编辑同一文档或代码文件时的实时同步。当一位用户在文档中输入文字或修改代码时，其他用户的界面会立刻显示这些更改，所有参与协作的人员可以实时看到彼此的操作，如同围坐在一张桌子旁共同完成一个任务，大大提高了团队协作的效率和效果，减少了因信息不同步导致的冲突和重复劳动。

三、WebSocket 的优势

1. 低延迟 与传统的轮询（Polling）和长轮询（Long - Polling）技术相比，WebSocket 的消息传递延迟近乎可以忽略不计。在轮询方式下，客户端需要按照固定的时间间隔不断向服务器发送请求来获取数据更新，即使没有新数据，也会频繁地进行无意义的请求发送和响应接收，导致大量时间和网络资源浪费，延迟较高。而 WebSocket 建立起持久连接后，数据可以在连接上随时发送，无需等待，真正实现了实时通信，这对于对时效性要求极高的应用场景（如在线游戏、实时金融交易等）来说至关重要，能够提供流畅、无缝的用户体验。

2. 双向通信 WebSocket 支持服务器和客户端之间的双向数据传输，客户端不仅能向服务器发送请求，服务器也能主动向客户端推送信息。这在传统 HTTP 协议下是很难实现的，因为 HTTP 是基于请求 - 响应模式的单向通信。双向通信的能力使得服务器可以主动将一些重要的更新、通知等信息及时推送给客户端，而无需等待客户端主动查询，如实时通知推送场景，大大增强了应用的交互性和灵活性，更好地满足用户对实时信息获取的需求。

3. 数据传输效率高 WebSocket 协议的头部信息相对简单，相比 HTTP 协议庞大的头部，减少了数据传输的开销。在频繁进行小数据量传输的情况下，WebSocket 的这种优势尤为明显，可以有效节省带宽资源，提高数据传输的效率。例如在实时聊天应用中，每条消息传输的数据量通常不大，使用 WebSocket 能够在保证消息实时性的同时，降低网络流量消耗，使应用在网络资源受限的环境下（如移动网络）也能保持良好的性能表现。

 

四、WebSocket 的局限性及注意事项

尽管 WebSocket 有诸多优势，但在实际应用中也有一些局限性和需要注意的地方。

1. 连接稳定性要求高 WebSocket 需要维持一条持久的 TCP 连接，在不稳定的网络环境下（如频繁切换网络、网络信号弱等），连接可能会出现中断。一旦连接中断，就需要及时进行重连操作，否则会影响应用的实时通信功能。开发者需要在应用中实现可靠的重连机制，并且对连接状态进行有效监控，以确保用户体验的连续性。

2. 安全性考虑 虽然 WebSocket 协议本身也有一些安全措施（如握手过程中可以使用 TLS 加密建立安全连接），但在数据传输过程中仍需要开发者采取额外的安全防护手段。例如，对敏感数据进行加密处理、防止恶意用户通过 WebSocket 连接进行攻击（如注入恶意脚本、发送大量垃圾数据等）。同时，要对客户端的身份进行严格验证，确保只有合法的用户能够建立 WebSocket 连接并进行数据交互，避免数据泄露和非法访问等问题。

3. 浏览器兼容性 虽然主流的现代浏览器都对 WebSocket 提供了良好的支持，但在一些老旧浏览器或特定的移动设备浏览器上，可能会出现兼容性问题。在开发过程中，需要对浏览器的 WebSocket 支持情况进行检测，并且针对不支持 WebSocket 的情况提供相应的降级方案（如使用轮询等传统技术作为备用），以保证应用在不同设备和浏览器上的可用性。

在应用 WebSocket 技术时，充分了解其局限性并采取相应的措施进行应对，才能更好地发挥其优势，打造出稳定、安全、高效的实时通信应用。

五、鸿蒙中的使用案例

概述

使用WebSocket建立服务器与客户端的双向连接，需要先通过createWebSocket()方法创建WebSocket对象，然后通过connect()方法连接到服务器。当连接成功后，客户端会收到open事件的回调，之后客户端就可以通过send()方法与服务器进行通信。当服务器发信息给客户端时，客户端会收到message事件的回调。当客户端不要此连接时，可以通过调用close()方法主动断开连接，之后客户端会收到close事件的回调。

若在上述任一过程中发生错误，客户端会收到error事件的回调。

websocket支持心跳检测机制，在客户端和服务端建立WebSocket连接之后，每间隔30秒客户端会发送Ping帧给服务器，服务器收到后应立即回复Pong帧，且不支持开发者关闭该机制。

接口说明

WebSocket连接功能主要由webSocket模块提供。使用该功能需要申请ohos.permission.INTERNET权限。具体接口说明如下表。

接口名	描述
createWebSocket()	创建一个WebSocket连接。
connect()	根据URL地址，建立一个WebSocket连接。
send()	通过WebSocket连接发送数据。
close()	关闭WebSocket连接。
on(type: 'open')	订阅WebSocket的打开事件。
off(type: 'open')	取消订阅WebSocket的打开事件。
on(type: 'message')	订阅WebSocket的接收到服务器消息事件。
off(type: 'message')	取消订阅WebSocket的接收到服务器消息事件。
on(type: 'close')	订阅WebSocket的关闭事件。
off(type: 'close')	取消订阅WebSocket的关闭事件
on(type: 'error')	订阅WebSocket的Error事件。
off(type: 'error')	取消订阅WebSocket的Error事件。

开发步骤

1. 导入需要的webSocket模块。

2. 创建一个WebSocket连接，返回一个WebSocket对象。

3. （可选）订阅WebSocket的打开、消息接收、关闭、Error事件。

4. 根据URL地址，发起WebSocket连接。

5. 使用完WebSocket连接之后，主动断开连接。

 

import webSocket from '@ohos.net.webSocket';
import promptAction from '@ohos.promptAction';
import { BusinessError } from '@kit.BasicServicesKit';
​
@Entry
@Component
struct webPage {
  @State text: string = "";
  private inputValue = "";
  private ws = webSocket.createWebSocket();
​
  build() {
    Column({ space: 10 }) {
      Row({ space: 10 }) {
        Button("建立连接")
          .onClick(() => {
            this.connect();
          })
​
        Button("关闭连接")
          .onClick(() => {
            this.close();
          })
      }
​
      Row({ space: 10 }) {
        TextInput()
          .width(220)
          .height(40)
          .onChange((value) => {
            this.inputValue = value;
          })
​
        Button("发送消息")
          .onClick(() => {
            this.send(this.inputValue);
          })
      }
​
      RichText(this.text)
​
    }
    .width('100%')
    .height('100%')
    .padding(10)
  }
​
  private connect() {
    let ws = webSocket.createWebSocket(); // 创建WebSocket实例
    ws.on("open", (error, data) => { // 监听连接建立
      this.ws = ws; // 连接建立成功，可以调用send方法向服务器发送数据
      this.text = "连接已建立"
      promptAction.showToast({
        message: JSON.stringify(data)
      })
    });
    ws.on("message", (err: BusinessError, data: string | ArrayBuffer)=> { // 监听服务器端发送的数据
      if (data) {
​
        this.text = JSON.stringify(data);
        promptAction.showToast({
          message: JSON.stringify(data)
        })
      }
    });
    ws.on("close", (data) => { // 监听连接关闭的回调
      this.text = "connection closed";
      promptAction.showToast({
        message: JSON.stringify(data)
      })
      // this.ws = null;
    });
    ws.on("error", (data) => { // 监听异常事件
      this.text = "connection closed";
      promptAction.showToast({
        message: JSON.stringify(data)
      })
      this.close();
    })
​
    // 在线模拟
    ws.connect("ws://124.222.6.60:8800", (error, data) => {
      if (!error) {
        console.log("connect:8888 " + JSON.stringify(data));
​
​
      }
    })
  }
​
  // 发送消息
  private send(text: string) {
    if (this.ws) {
      // 当收到on('open')事件时，可以通过send()方法与服务器进行通信
      this.ws.send(text, (err: BusinessError, value: boolean)  => {
        if (!err) {
          console.log("Message send successfully");
        } else {
          console.log("Failed to send the message. Err:" + JSON.stringify(err));
        }
      })
    }
  }
​
  // 关闭连接
  private close() {
    if (this.ws) {
      this.ws.close((data) => {
        console.log("connection closed: " + data);
        this.text = "连接已关闭";
​
​
        promptAction.showToast({
          message: JSON.stringify(data)
        })
      });
      // this.ws = null;
    }
  }
}
​

 

六、总结

WebSocket 技术以其低延迟、双向通信和高数据传输效率等优势，在众多领域展现出了强大的生命力和广泛的应用前景。从我们日常使用的社交聊天、新闻资讯获取，到金融交易、在线游戏、物联网以及团队协作等复杂场景，WebSocket 正在悄然改变着我们与互联网互动的方式，让实时、流畅的通信成为互联网应用的常态。随着技术的不断发展和优化，相信 WebSocket 将在更多的创新应用场景中大放异彩，为我们带来更加丰富多彩的数字化体验。

完毕。

 

在这里感谢该网站提供的测试

http://www.websocket-test.com/