在Heroku部署的NextJS项目能否直接使用Websockets？

• 不需要迁移到 Express.js 等其他技术栈，Next.js 项目部署到 Heroku 后可直接支持 WebSocket，但需注意以下配置细节：

  1. 利用 Next.js API 路由实现 WebSocket：Next.js 的 API 路由基于 Node.js 服务器，你可以在 API 路由文件中直接集成 ws 这类 WebSocket 库来搭建服务。
  2. Heroku 端无需额外开启功能：Heroku 的 dyno 原生支持 WebSocket，只需确保你的服务器代码正确处理 HTTP 到 WebSocket 的升级请求，同时注意 Heroku 默认 55 分钟无活动会断开连接的规则。
  3. 依赖配置：在项目中安装 ws 或其他 WebSocket 库，并在 package.json 中正确声明依赖。

• 示例代码（Next.js API 路由）：

// pages/api/websocket.js
import { WebSocketServer } from 'ws';

export default function handler(req, res) {
  if (req.method === 'GET') {
    // 初始化 WebSocket 服务（避免重复创建）
    if (!res.socket.server.wss) {
      const wss = new WebSocketServer({ noServer: true });
      res.socket.server.wss = wss;

      wss.on('connection', (ws) => {
        ws.on('message', (data) => {
          ws.send(`Received: ${data}`);
        });
      });
    }

    // 处理连接升级
    res.socket.server.wss.handleUpgrade(req, res.socket, Buffer.alloc(0), (ws) => {
      res.socket.server.wss.emit('connection', ws, req);
    });
  } else {
    res.status(405).json({ message: 'Method not allowed' });
  }
}

• 部署注意事项：
  • 在 package.json 中指定 Node.js 版本，确保和本地开发环境一致，比如：

    "engines": {
      "node": ">=18.x"
    }
    

  • 启动脚本直接使用 Next.js 官方的 next start 即可，无需额外用 Express 包裹。

内容的提问来源于stack exchange，提问作者Oscar Figueroa