基于 Fastify 实现 WebSocket 服务端-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，我们经常需要实现实时通信的功能，比如聊天室、在线游戏等。而 WebSocket 技术可以帮助我们实现这些功能，它是一种基于 TCP 协议的全双工通信协议，能够在客户端和服务端之间建立持久连接，实现实时通信。

在本文中，我们将介绍如何使用 Fastify 框架来实现 WebSocket 服务端，并提供示例代码。

Fastify 简介

Fastify 是一个快速、低开销的 Web 框架，它是 Node.js 生态系统中速度最快的框架之一。Fastify 的主要特点包括：

快速：Fastify 的性能非常出色，它可以处理每秒数十万个请求。
低开销：Fastify 的内存占用非常小，它可以在极端情况下处理数百万个并发连接。
插件化：Fastify 支持插件机制，可以轻松地扩展功能。
强类型：Fastify 支持使用 JSON Schema 来定义 API 接口的输入输出参数，可以帮助我们更好地管理和验证数据。

实现 WebSocket 服务端

Fastify 框架本身并不支持 WebSocket，但是我们可以使用 fastify-websocket 库来实现 WebSocket 服务端。该库基于 ws 库实现，提供了一些快速启动 WebSocket 服务端的封装方法。

安装 fastify-websocket

首先，我们需要安装 fastify-websocket 库：

npm install fastify-websocket

编写代码

接下来，我们来编写代码。首先，我们需要创建一个 Fastify 实例，并注册 fastify-websocket 插件：

const fastify = require('fastify')()
const fastifyWs = require('fastify-websocket')

fastify.register(fastifyWs)

接着，我们需要定义一个 WebSocket 路由，用于处理客户端连接：

fastify.get('/ws', { websocket: true }, (connection, req) => {
  connection.on('message', (msg) => {
    connection.send(`You sent: ${msg}`)
  })
})

在该路由中，我们使用 { websocket: true } 配置项来告诉 Fastify，这是一个 WebSocket 路由。当客户端连接时，Fastify 会自动创建一个 WebSocket 连接，并将连接对象作为第一个参数传递给回调函数。我们可以在回调函数中监听 message 事件，处理客户端发送的消息，并使用 send 方法向客户端发送消息。

最后，我们需要启动 Fastify 服务器：

fastify.listen(3000, (err) => {
  if (err) throw err
  console.log(`Server listening on ${fastify.server.address().port}`)
})

完整代码如下：

// javascriptcn.com 代码示例
const fastify = require('fastify')()
const fastifyWs = require('fastify-websocket')

fastify.register(fastifyWs)

fastify.get('/ws', { websocket: true }, (connection, req) => {
  connection.on('message', (msg) => {
    connection.send(`You sent: ${msg}`)
  })
})

fastify.listen(3000, (err) => {
  if (err) throw err
  console.log(`Server listening on ${fastify.server.address().port}`)
})

测试 WebSocket 服务端

现在，我们可以使用 WebSocket 客户端来测试我们的 WebSocket 服务端了。以下是一个简单的 WebSocket 客户端示例：

// javascriptcn.com 代码示例
const WebSocket = require('ws')

const ws = new WebSocket('ws://localhost:3000/ws')

ws.on('open', () => {
  console.log('Connected to server')

  ws.send('Hello, server!')
})

ws.on('message', (msg) => {
  console.log(`Received message: ${msg}`)
})

在客户端代码中，我们使用 ws 库创建一个 WebSocket 连接，连接到我们的 WebSocket 服务端。当连接建立成功后，我们使用 send 方法向服务端发送消息。服务端收到消息后，会将消息内容加上前缀 You sent:，然后将消息发送回客户端。客户端收到消息后，会输出消息内容。

现在，我们可以同时启动服务端和客户端，测试我们的 WebSocket 服务端是否正常工作了。

总结

在本文中，我们介绍了如何使用 Fastify 框架和 fastify-websocket 库来实现 WebSocket 服务端，并提供了示例代码。通过本文的学习，我们可以更好地理解 WebSocket 技术的原理和实现方式，同时也可以掌握使用 Fastify 框架来实现 WebSocket 服务端的方法。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/656bbabbd2f5e1655d41ccae