Deno WebSockets 入门教程

在现代 Web 开发中，WebSockets 已经成为了实时通信的标准。WebSockets 允许客户端与服务器之间进行双向通信，不再需要轮询来获取新的数据。而 Deno 作为一个新兴的 JavaScript 运行时环境，也提供了 WebSockets 的支持。本文将介绍如何在 Deno 中使用 WebSockets 进行实时通信。

WebSocket 简介

WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议。它可以在客户端和服务器之间建立一个持久的连接，这使得服务器可以主动向客户端推送数据，而不需要客户端轮询来获取新的数据。WebSocket 协议是基于 HTTP 协议的，因此可以穿过大多数防火墙和代理服务器。

Deno 中的 WebSockets

Deno 提供了一个内置的 WebSocket 模块，可以用于创建 WebSocket 服务器和客户端。WebSocket 模块的 API 与浏览器中的 WebSocket API 相似，但是有一些不同之处。下面是一个简单的 WebSocket 服务器示例：

// www.javascriptcn.com code example
import { serve } from "https://deno.land/std/http/server.ts";
import { acceptWebSocket, isWebSocketCloseEvent } from "https://deno.land/std/ws/mod.ts";

const server = serve({ port: 3000 });
console.log("WebSocket server started on port 3000");

for await (const req of server) {
  if (req.url === "/ws") {
    const { conn, r: bufReader, w: bufWriter, headers } = req;
    acceptWebSocket({
      conn,
      bufReader,
      bufWriter,
      headers,
    }).then(handleWebSocket);
  }
}

async function handleWebSocket(ws: WebSocket) {
  console.log("WebSocket connected");

  try {
    for await (const ev of ws) {
      if (typeof ev === "string") {
        console.log("WebSocket received:", ev);
        ws.send(ev);
      } else if (isWebSocketCloseEvent(ev)) {
        console.log("WebSocket closed");
      }
    }
  } catch (err) {
    console.error(`Failed to receive frame: ${err}`);
    if (!ws.isClosed) {
      await ws.close(1000).catch(console.error);
    }
  }
}

在上面的示例中，我们使用 Deno 的 serve 函数创建了一个 HTTP 服务器，在端口 3000 上监听请求。当请求的 URL 是 /ws 时，我们使用 acceptWebSocket 函数来接受 WebSocket 连接，并将连接交给 handleWebSocket 函数进行处理。在 handleWebSocket 函数中，我们通过 for await 循环来接收来自客户端的消息，并将消息回传给客户端。

WebSocket 客户端

除了创建 WebSocket 服务器外，Deno 还提供了一个内置的 WebSocket 客户端模块，用于连接 WebSocket 服务器并发送和接收消息。下面是一个简单的 WebSocket 客户端示例：

// www.javascriptcn.com code example
import { connectWebSocket } from "https://deno.land/std/ws/mod.ts";

const ws = await connectWebSocket("ws://localhost:3000/ws");
console.log("WebSocket connected");

ws.send("Hello, server!");

for await (const ev of ws) {
  if (typeof ev === "string") {
    console.log("WebSocket received:", ev);
  } else if (isWebSocketCloseEvent(ev)) {
    console.log("WebSocket closed");
  }
}

在上面的示例中，我们使用 connectWebSocket 函数连接到一个 WebSocket 服务器，并将连接交给 for await 循环来接收来自服务器的消息。在循环中，我们通过 typeof 来判断接收到的消息类型，并进行相应的处理。

结语

本文介绍了如何在 Deno 中使用 WebSockets 进行实时通信。WebSocket 可以极大地提高 Web 应用程序的性能和用户体验，因为它允许服务器主动向客户端推送数据。如果你想深入了解 Deno 和 WebSocket，请阅读 Deno 和 WebSocket 的官方文档。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d27dfea941bf71344b0f93