如何在Socket.io中建立与Heroku Server的Socket连接？

Question

我做了一个全栈的mern应用程序，并在heroku中托管了nodejs后端，前端运行在netlify上。所有的.env变量都是为heroku和netlify设置的，我还设置了cors()。该网站有聊天功能，所以我使用socket.io的，这是用来工作很好的开发。

这是我的heroku服务器(后端应用编程接口) https://ural-shop.herokuapp.com/的链接

在messenger.js文件中(这是套接字连接发生的位置)

import React, { useEffect, useState, useRef } from "react";
import io from "socket.io-client";

const socketRef = useRef();

useEffect(() => {
      socketRef.current = io.connect("https://ural-shop.herokuapp.com/");
},[]);

index.js文件(后台主文件)

const express = require("express");
const app = express();
const http = require("http");
const server = http.createServer(app);
const socket = require("socket.io");

app.use(cors());

const io = socket(server, {
  cors: { origin: "https://ural-shop.herokuapp.com/" },
});

server.listen(PORT, () => console.log(`Server on port ${PORT}`));

我只放了文件的必要部分。

在google开发者控制台，我看到了这一点。

Developer Console Output

Error From Network Section Of Developer console

Answer 1

看看你的截图，看起来你没有在你的后端正确配置cors。要么将*作为值，以便允许来自任何地方的请求，要么将前端应用程序的URL放在后端API的URL中。(https://ural-shop.herokuapp.com/是您配置的地址，它应该是您的前端应用程序的URL )

如果起作用了，请告诉我。