专业编程教程与实战项目分享平台

网站首页 > 技术文章 正文

8行代码实现一个websoket（代码如何实现）

ins518 2025-06-30 16:45:24 技术文章 7 ℃ 0 评论

前言：

websoket是一个通信协议，本质上基于TCP协议，传统http协议有个弊端，就是客户端发起，服务端响应，一问一答式，在需要实时通信的场景下http请求就显得有些低效，在这时候可以使用websoket，只需客户端与服务端建立一次连接，服务端就可以主动向客户端推送消息。

与服务端实时通信方式:

1.ajax轮询

以一定频率通过ajax请求服务器

2.Long Polling长轮询

客户端发送请求至服务器，服务器若没有返回信息则挂起当前请求，等有返回信息时会将信息返回至客户端，同时关闭当前请求。客户端收到服务端返回的信息后会立即发起下一次请求。

3.websoket

客户端向服务器发起一个http请求，这个请求中附带了个头信息，告诉服务端这是一个申请协议升级的请求。服务端解析附加的头信息，然后将应答信息返回给客户端，客户端与服务端的链接就建立起来了，双方都可主动向另一方推送消息。

websoket实战 （nodejs-websocket）

1.安装依赖模块

npm install nodejs-websocket --save

2.nodejs创建websoket服务

//引入依赖模块
var ws = require("nodejs-websocket");
//创建一个websoket服务
var server = ws
  .createServer(function (socket) {
    //监听文本消息
    socket.on("text", function (str) {
      //发送消息给客户端
      socket.sendText(`我是服务器，我已经收到了你发的消息。---【${str}】`);
    });
  })
  .listen(3000);

3.客户端相关代码

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title></title>
  <script>
   //创建一个websoket连接至本地服务端
   var ws = new WebSocket('ws://localhost:3000/');
   //打开链接
   ws.onopen = function() {
    //每秒向服务器发送一个文本消息
    setInterval(function() {
     ws.send('你好，服务端');
    }, 1000);
   }
   //监听接收到的消息
   ws.onmessage = function(e) {
    console.log(e.data)
   }
  </script>
 </head>
 <body>
 </body>
</html>

结尾：

本文是websoket的一个简单介绍,大致流程就是客户端与服务端建立一次连接，然后客户端监听服务端发过来的消息，通过操作dom，显示到当前页面，websoket主要用于实时通信im、聊天室等，如果各位项目中有需要使用可以参阅详细文档。

Tags：

猜你喜欢

本文暂时没有评论，来添加一个吧(●'◡'●)

欢迎 你 发表评论:

最近发表
标签列表