时间戳

首页 > 解决方案 > 如何连接部署在 Heroku 上的套接字 io

node.js - 如何连接部署在 Heroku 上的套接字 io

问题描述

我在本地主机上运行聊天应用程序，它运行正常，但是当我部署回 Heroku 和 Front 到 Versel 时，一切都无法正常工作。起初，我只是到处更改地址，在前面的套接字上给出状态 200，在后面 - 404。

现在，一般情况下，socket.io 的设置是空的，如下面的代码所示。有时我将完整的地址放在 Heroku 中，在 env 变量中指明端口（每次发出的方式不同），但没有帮助。如果我在前面用“：PORT”在 Heroku 上指明应用程序的路径，那么我会收到 CORS 错误。拜托，我已经和它战斗了三天。我尝试使用“https://chat-lite-back.herokuapp.com/”作为套接字 URL，尝试在 Heroku 中使用配置变量 - 也许我用错了。

Front只是一个帮助文件，它被导出到一些组件并用作“socket.on smth ...”：

import { io } from "socket.io-client";
export const socket = io();

回来了：

const express = require("express");
const app = express();
const cors = require("cors");
const { UserModel } = require("./models");
const prettyDate2 = require("./helpers/time");

app.use(cors());

app.use(express.json());
app.use(express.urlencoded({ extended: true }));

app.options("https://chat-lite-two.vercel.app", cors());
const mongoose = require("mongoose");
require("dotenv").config();

const http = require("http").createServer(app);

const io = require("socket.io")(http);

http.listen(3001, function () {
  console.info("Server is running");
  console.log(io);
});
io.on("connection", (socket) => {
  console.log("SOCKET", socket);
  console.info("Socket connected", socket.id);
  // socket.broadcast.emit("user:join", socket.id);

  socket.on("message:send", (data) => {
    const dateMessage = prettyDate2();
    const { nickname, text, id } = data;
    const newData = { nickname, text, id, dateMessage };
    socket.broadcast.emit("message:fromServer", newData);
    socket.emit("message:fromServer", newData);
  });

  socket.on("typing", (data) => {
    const { user, typing } = data;
    socket.broadcast.emit("userTyping", user, typing);
  });
  socket.on("stopTyping", () => {
    socket.broadcast.emit("userStoppedTyping");
  });
  socket.on("message:delete", (id) => {
    socket.emit("DeletingMessage", id);
    socket.broadcast.emit("DeletingMessage", id);
  });
});

function getSocketIo() {
  return io;
}
module.exports.getSocketIo = getSocketIo;

const { userApi } = require("./api/userApi");
app.use("/", userApi);

app.use((err, _, res, __) => {
  return res.status(500).json({
    status: "fail",
    code: 500,
    message: err.message,
  });
});

const { PORT, DB_HOST } = process.env;

const dbConnection = mongoose.connect(DB_HOST, {
  useNewUrlParser: true,
  useFindAndModify: false,
  useCreateIndex: true,
  useUnifiedTopology: true,
});

dbConnection
  .then(() => {
    console.info("DB connect");
    app.listen(PORT || 3000, () => {
      console.info("server running");
    });
  })
  .catch((err) => {
    console.error(err);
  });

heroku 日志示例：

2021-08-07T16:35:12.383736+00:00 heroku[router]: at=info method=GET path="/socket.io/?EIO=4&transport=polling&t=NiXT-M7" host=chat-lite-back.herokuapp.com request_id=a9543ade-6cc6-4e39-b413-d73c875e2c45 fwd="188.162.86.199" dyno=web.1 connect=0ms service=2ms status=404 bytes=425 protocol=https

在前面，状态为 200：

https://chat-lite-two.vercel.app/socket.io/?EIO=4&transport=polling&t=NiXUBOr

我的 GitHub 前面有代码：https ://github.com/mrmadgav/chat-lite/

UPD：改回在服务器端使用这样的套接字中的属性：

const io = require("socket.io")(http, {
  cors: {
    origin: "https://chat-lite-two.vercel.app/",
    methods: ["GET", "POST"],
    credentials: true,
  },
});

在客户端就像这样：

import { io } from "socket.io-client";

export const socket = io("https://chat-lite-back.herokuapp.com/git ", {
  withCredentials: true,
});

通过这种方式，我在 Heroku Heroku 日志上出现了 Front & CORS/503 错误的 CORS 错误：

2021-08-07T17:15:22.431397+00:00 app[api]: Release v51 created by user madgav@mail.ru
2021-08-07T17:15:22.431397+00:00 app[api]: Deploy 946fb55a by user madgav@mail.ru
2021-08-07T17:15:25.000000+00:00 app[api]: Build succeeded
2021-08-07T17:15:30.338990+00:00 heroku[web.1]: Starting process with command `npm start`
2021-08-07T17:15:34.684288+00:00 app[web.1]: 
2021-08-07T17:15:34.684307+00:00 app[web.1]: > server@1.0.0 start /app
2021-08-07T17:15:34.684308+00:00 app[web.1]: > node server.js
2021-08-07T17:15:34.684308+00:00 app[web.1]: 
2021-08-07T17:15:36.433645+00:00 heroku[web.1]: State changed from starting to up
2021-08-07T17:15:37.238945+00:00 heroku[router]: at=info method=GET path="/socket.io/?EIO=4&transport=polling&t=NiXdClB" host=chat-lite-back.herokuapp.com request_id=b80802c1-9467-454b-a38e-65c86bb51493 fwd="92.255.176.12" dyno=web.1 connect=0ms service=214ms status=200 bytes=350 protocol=https
2021-08-07T17:15:37.202365+00:00 app[web.1]: Server is running
2021-08-07T17:15:38.302272+00:00 app[web.1]: DB connect
2021-08-07T17:15:38.306572+00:00 app[web.1]: events.js:377
2021-08-07T17:15:38.306575+00:00 app[web.1]:       throw er; // Unhandled 'error' event
2021-08-07T17:15:38.306575+00:00 app[web.1]:       ^
2021-08-07T17:15:38.306576+00:00 app[web.1]: 
2021-08-07T17:15:38.306577+00:00 app[web.1]: Error: listen EADDRINUSE: address already in use :::4133
2021-08-07T17:15:38.306577+00:00 app[web.1]:     at Server.setupListenHandle [as _listen2] (net.js:1320:16)
2021-08-07T17:15:38.306577+00:00 app[web.1]:     at listenInCluster (net.js:1368:12)
2021-08-07T17:15:38.306578+00:00 app[web.1]:     at Server.listen (net.js:1454:7)
2021-08-07T17:15:38.306579+00:00 app[web.1]:     at Function.listen (/app/node_modules/express/lib/application.js:618:24)
2021-08-07T17:15:38.306580+00:00 app[web.1]:     at /app/server.js:86:9
2021-08-07T17:15:38.306581+00:00 app[web.1]:     at processTicksAndRejections (internal/process/task_queues.js:95:5)
2021-08-07T17:15:38.306581+00:00 app[web.1]: Emitted 'error' event on Server instance at:
2021-08-07T17:15:38.306582+00:00 app[web.1]:     at emitErrorNT (net.js:1347:8)
2021-08-07T17:15:38.306582+00:00 app[web.1]:     at processTicksAndRejections (internal/process/task_queues.js:82:21) {
2021-08-07T17:15:38.306582+00:00 app[web.1]:   code: 'EADDRINUSE',
2021-08-07T17:15:38.306583+00:00 app[web.1]:   errno: -98,
2021-08-07T17:15:38.306583+00:00 app[web.1]:   syscall: 'listen',
2021-08-07T17:15:38.306584+00:00 app[web.1]:   address: '::',
2021-08-07T17:15:38.306584+00:00 app[web.1]:   port: 4133
2021-08-07T17:15:38.306585+00:00 app[web.1]: }
2021-08-07T17:15:38.369491+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2021-08-07T17:15:38.370277+00:00 app[web.1]: npm ERR! errno 1
2021-08-07T17:15:38.393109+00:00 app[web.1]: npm ERR! server@1.0.0 start: `node server.js`
2021-08-07T17:15:38.393387+00:00 app[web.1]: npm ERR! Exit status 1
2021-08-07T17:15:38.393718+00:00 app[web.1]: npm ERR! 
2021-08-07T17:15:38.393938+00:00 app[web.1]: npm ERR! Failed at the server@1.0.0 start script.
2021-08-07T17:15:38.394144+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2021-08-07T17:15:38.420356+00:00 app[web.1]: 
2021-08-07T17:15:38.420621+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2021-08-07T17:15:38.420812+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2021-08-07T17_15_38_395Z-debug.log
2021-08-07T17:15:38.476323+00:00 heroku[web.1]: Process exited with status 1
2021-08-07T17:15:38.543452+00:00 heroku[web.1]: State changed from up to crashed
2021-08-07T17:15:43.016858+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/socket.io/?EIO=4&transport=polling&t=NiXdG9o" host=chat-lite-back.herokuapp.com request_id=a5acae71-e904-43c1-bfa6-20ad18ccdadd fwd="92.255.176.12" dyno= connect= service= status=503 bytes= protocol=https

标签： node.jsreactjsherokusocket.iochat

解决方案

推荐阅读