WebSocket入门

最新推荐文章于 2024-06-24 09:18:51 发布

ZzDIY

最新推荐文章于 2024-06-24 09:18:51 发布

阅读量286

点赞数

分类专栏： WebSocket 文章标签： websocket nodejs

本文链接：https://blog.csdn.net/qq_43526925/article/details/117665993

版权

本文介绍了WebSocket协议的概念，作为H5提供的全双工通讯协议，它相比Ajax轮询更节省资源和实时。文章选择了ws和socket.io两个库进行实战，详细讲述了从准备工作到项目启动的步骤，并提供了相关代码示例，最后鼓励读者尝试用所学制作聊天室。

摘要由CSDN通过智能技术生成

编译器：vscode

概念：h5提供的一种单个TCP连接上进行全双工通讯的协议

优势：很多网站为了实现推送技术，所用的技术都是 Ajax 轮询，这种有着很明显的缺点就是浪费很多的带宽等资源。而WebSocket 协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。

注意：如果客户端要使用WebSocket那么服务端要下载支持它的服务

ws(二选一)

准备工作

注意：我这边由于npm一直下不了ws，使用cnpm先下载bufferutil@^{4.0.1和utf-8-validate@}5.0.2才能下载ws。

cnpm install express --save
cnpm install bufferutil@^4.0.1
cnpm install utf-8-validate@^5.0.2
cnpm install ws --save

项目开始

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>客户端</title>
  </head>
  <body>
    <script>
      var ws = new WebSocket('ws://localhost:8080');
      ws.onopen = function () {
        console.log('ws打开');
        ws.se