# WebSocket > 支持 WebSocket 的实时双向通信。 ```html [index.html] CrossWS Test Page

{{ message.user }}

Avatar

{{ message.text }}

{{ message.date }}

` ``` ```ts [nitro.config.ts] import { defineConfig } from "nitro"; export default defineConfig({ serverDir: "./", renderer: { static: true }, features: { websocket: true }, }); ``` ```json [package.json] { "type": "module", "scripts": { "dev": "nitro dev", "build": "nitro build" }, "devDependencies": { "nitro": "latest" } } ``` ```json [tsconfig.json] { "extends": "nitro/tsconfig" } ``` ```ts [vite.config.ts] import { defineConfig } from "vite"; import { nitro } from "nitro/vite"; export default defineConfig({ plugins: [nitro()] }); ``` ```ts [routes/_ws.ts] import { defineWebSocketHandler } from "nitro/h3"; export default defineWebSocketHandler({ open(peer) { peer.send({ user: "server", message: `Welcome ${peer}!` }); peer.publish("chat", { user: "server", message: `${peer} joined!` }); peer.subscribe("chat"); }, message(peer, message) { if (message.text().includes("ping")) { peer.send({ user: "server", message: "pong" }); } else { const msg = { user: peer.toString(), message: message.toString(), }; peer.send(msg); // echo peer.publish("chat", msg); } }, close(peer) { peer.publish("chat", { user: "server", message: `${peer} left!` }); }, }); ``` 此示例使用 WebSockets 实现了一个简单的聊天室。客户端连接后，可以发送消息，并实时接收其他用户的消息。服务器使用发布/订阅通道向所有已连接的客户端广播消息。 ## WebSocket 处理器 使用 `defineWebSocketHandler` 创建一个 WebSocket 路由。 ```ts [routes/_ws.ts] import { defineWebSocketHandler } from "nitro/h3"; export default defineWebSocketHandler({ open(peer) { peer.send({ user: "server", message: `Welcome ${peer}!` }); peer.publish("chat", { user: "server", message: `${peer} joined!` }); peer.subscribe("chat"); }, message(peer, message) { if (message.text().includes("ping")) { peer.send({ user: "server", message: "pong" }); } else { const msg = { user: peer.toString(), message: message.toString(), }; peer.send(msg); // 回显 peer.publish("chat", msg); } }, close(peer) { peer.publish("chat", { user: "server", message: `${peer} left!` }); }, }); ``` `defineWebSocketHandler()` 暴露了不同的钩子，用于集成 WebSocket 生命周期的不同部分。 ## 了解更多 - [路由](/docs/routing) - [crossws 文档](https://crossws.h3.dev/guide/hooks)