将SocketIO和Nextjs部署到Vercel，套接字没有连接
我正在尝试创建一个下一个应用程序，它也与它的后端进行实时通信，并使用socket.io。它在本地(即使在构建时)运行得很好，但是当部署到vercel时，我得到了WebSocket connection to '<URL>' failed: WebSocket is closed before the connection is established.类型的错误。
首先，我创建了一个定制的Nextjs服务器：
import { createServer } from "http";
import { parse } from "url";
import { Server as SocketIOServer, Socket } from "socket.io";
import next from "next";
const port = parseInt(process.env.PORT || "3000", 10);
const dev = process.env.NODE_ENV !== "production";
const app = next({ dev });
const handle = app.getRequestHandler();
console.log("hello");
app.prepare().then(() => {
const server = createServer((req, res) => {
const parsedUrl = parse(req.url!, true);
handle(req, res, parsedUrl);
}).listen(port);
// tslint:disable-next-line:no-console
console.log(
`> Server listening at http://localhost:${port} as ${
dev ? "development" : process.env.NODE_ENV
}`
);
const socketIO = new SocketIOServer(server, { transports: ["websocket"] });
socketIO.on("connection", (socket: Socket) => {
console.log("connected", socket.id);
});
});然后在前面：
import { io } from "socket.io-client";
useEffect(() => {
const socket = io(window?.location?.hostname || "http://localhost:3000", {
reconnectionDelay: 1000,
reconnection: true,
reconnectionAttempts: 10,
transports: ["websocket"],
agent: false,
upgrade: false,
rejectUnauthorized: false
});
socket.on("connect", () => {
console.log("someone connected: ", socket?.id);
});
}, []);这段代码在本地运行非常好，在dev模式和build && start模式下都没有任何问题，两者都工作得很好。
一旦部署到vercel，问题就开始了。
如果我不将":3000"添加到window.location.hostname中，则会得到错误：
WebSocket connection to 'wss://xxxxxx.vercel.app/socket.io/?EIO=4&transport=websocket' failed: doOpen
如果我加上它，它就变成：
WebSocket connection to 'wss://xxxxxx.vercel.app:3000/socket.io/?EIO=4&transport=websocket' failed: WebSocket is closed before the connection is established.
回答 1
Stack Overflow用户
发布于 2022-01-06 19:28:10
答案是：
这是不可能的。Vercel不支持Nextjs所具有的自定义服务器功能。真丢人。
问题不在于套接字本身，问题在于Vercel，由于上述原因，它无法工作。
无论谁有类似的问题，我发现的最简单的解决办法就是简单地搬到Heroku，它们很容易设置(我本来打算做的，GCP，AWS等等，但对于那些不是DevOps的人来说，它们都更耗费时间和更复杂)。因此，我与Heroku在几分钟内起床并运行，而自定义服务器现在正在工作。
https://stackoverflow.com/questions/70606156
复制相似问题
腾讯云开发者
