nodejs + websocket (socket.io)

栏目: Node.js · 发布时间: 5年前

内容简介:初次接触 WebSocket 的人,都会问同样的问题:我们已经有了 HTTP 协议,为什么还需要另一个协议?它能带来什么好处?答案很简单,因为

为什么需要 WebSocket?

因为个人对概念理解不是很深,文字表达能力不强,如果有关HTTP等方面描述不准确,欢迎纠正,谢谢大家

初次接触 WebSocket 的人,都会问同样的问题:我们已经有了 HTTP 协议,为什么还需要另一个协议?它能带来什么好处?

答案很简单,因为 HTTP 协议有一个缺陷:通信只能由客户端发起

举例来说:我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果。HTTP 协议做不到服务器主动向客户端推送信息。

这种单向请求的特点,注定了如果服务器有连续的状态变化,客户端要获知就非常麻烦。我们只能使用 "轮询":设置定时器每隔一段时候,就发出一个"询问"(简单理解为ajax请求),了解服务器有没有新的信息 。最典型的场景就是聊天室。

---- 参考了 阮一峰 老师的文章: WebSocket 教程

轮询请求的缺点:

  1. 不停地链接,断开,链接,断开请求,浪费很多服务器资源
  2. 浪费带宽
  3. 移动端浪费流量

websocket的优点:

  1. 没有同源限制,客户端可以与任意服务器通信,不涉及到跨域的问题。
  2. 双向通信,服务器可以向客户端主动发送数据。
  3. 数据格式比较轻量,性能开销小,通信高效。

websocket为什么高效

普通的http通信是基于字符的通信(超文本), websocket一开始是文本协议, 但是链接建立后编程了二进制协议, 数据无需转换等。

socket.io的使用

socket.io是一个封装后的库,原生的 websocket 因为比较复杂,需要自己处理请求头,设置持续链接等等。因此选择使用的socket.io

安装

npm i socket.io -D

socket主要有两个方法:

sock.emit('name', data) 主动发送数据

sock.on('name', function(data ){ })` 接收数据

1.服务端

// server.js
    const http = require('http')
    const io = require('socket.io')
    
    let server = http.createServer((req, res)=>{})
    server.listen(8080)
    
    // 建立ws  websocket简称ws
    let wsServer = io.listen(server);
    
    wsServer.on('connection', sock=>{
    
      sock.on('aaa', function(a,b){         // name -> 'aaa' 要与前台的 name 保持一致
        console.log(a)
        console.log(b)
        console.log(arguments)
      })     // 'aaa'事件名与前台的一致
    
      setInterval(function(){
        sock.emit('bbb', '服务器发来的数据')  // name -> 'bbb' 要与前台的 name 保持一致
      }, 2000)
    })

2. 客户端

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <script src='http://localhost:8080/socket.io/socket.io.js'></script> 
  <!-- 
    其实你的本地目录并不存在 XXX/socket.io/socket.io.js 文件,当向后台发送请求后,socket会判断req.url,做一个类似于下面的处理,读取 socket-io.js:
    if(req.url == '/socket.io/socket.io.js'){ 
        fs.readFile('node_modules/socket.io-client/dist/socket-io.js')   
    }
    当然我们也可以直接将socket-io.js复制出来,直接用script引用,但是如果socket更新后我们的代码可能不是最新版,会出现一些问题。
    因此不建议这样使用:<script src='./socket.io.js'></script> 
  -->
  <script>
    let sock = io.connect('ws://localhost:8080/')    // 这里是 ws 协议,不是 http 协议

    // sock.emit
    // sock.on

    sock.emit('aaa', 'maruihua', 5 )

    sock.on('bbb', data => console.log(data))
  </script>
</head>
<body>
</body>
</html>

上面的代码直接复制下来就能使用。怎么运行nodejs服务我就不再讲了啊。

怎么样,是不是特别简单

妈妈再也不用担心我的学习了~


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Practical Vim, Second Edition

Practical Vim, Second Edition

Drew Neil / The Pragmatic Bookshelf / 2015-10-31 / USD 29.00

Vim is a fast and efficient text editor that will make you a faster and more efficient developer. It’s available on almost every OS, and if you master the techniques in this book, you’ll never need an......一起来看看 《Practical Vim, Second Edition》 这本书的介绍吧!

RGB转16进制工具
RGB转16进制工具

RGB HEX 互转工具

MD5 加密
MD5 加密

MD5 加密工具

Markdown 在线编辑器
Markdown 在线编辑器

Markdown 在线编辑器