Socket.io - GET ส่งคืน 404 (ไม่พบ) (polling-xhr)

ฉันเคยเห็นคำถามที่คล้ายกันที่ถูกถามที่นี่ แต่จนถึงตอนนี้ฉันไม่สามารถหาวิธีแก้ไขปัญหาของฉันได้ - ตอนนี้ฉันอาจจะโกรธเล็กน้อย

ฉันกำลังพยายามใช้ socket.io และจนถึงตอนนี้ได้ตั้งค่าเซิร์ฟเวอร์ด่วนและให้ socket.io ทำงานบนเซิร์ฟเวอร์และบนฝั่งไคลเอ็นต์ (socket.io-client) .

น่าเสียดายที่เมื่อฉันพยายามสื่อสารกับเซิร์ฟเวอร์จากฝั่งไคลเอ็นต์ ฉันพบ ข้อผิดพลาด 404 ซ้ำทันที:

GET http://localhost:3000/socket.io/?EIO=3&transport=polling&t=MU8YJvg 404 (Not Found)
GET http://localhost:3000/socket.io/?EIO=3&transport=polling&t=MU8YJvg 404 (Not Found)
GET http://localhost:3000/socket.io/?EIO=3&transport=polling&t=MU8YJvg 404 (Not Found)
...

โดยพื้นฐานแล้ว BrowserSync ของฉันจะทำงานที่ localhost:3000 และ express/socket.io ของฉันจะทำงานที่ localhost:8080

การตั้งค่า ด่วน ของฉันมีลักษณะดังนี้:

const express = require("express");
const app = express();
const path = require("path");
const proxy = require("http-proxy-middleware");
const http = require("http").Server(app);
const io = require("socket.io").listen(http);


io.on("connection", socket => {
  console.log("a user connected: ", socket.id);
});

app.set("port", 8080);

// Attempt to proxy around BrowserSync
app.use(
  "/socket-io",
  proxy({
    target: "http://localhost:8080",
    ws: true,
    pathRewrite: { "^/socket.io": "/" }
  })
);

http.listen(8080, () => {
  console.log(`Listening on ${http.address().port}`);
});

webpack.config.js

....
plugins: [
    definePlugin,
    new BrowserSyncPlugin({
      host: process.env.IP || "localhost",
      port: process.env.PORT || 3000,
      server: {
        baseDir: ["./", "./dist"]
      }
    })
]
...

ฉันใช้

(dev-deps)
    "browser-sync": "^2.26.3",
    "browser-sync-webpack-plugin": "^2.2.2",
(deps)
    "express": "^4.16.4",
    "socket.io": "^2.2.0",
    "socket.io-client": "^2.2.0",

ฉันจะขอบคุณจริงๆ สำหรับความช่วยเหลือใดๆ ในเรื่องนี้ เพราะไม่มีอะไรสมเหตุสมผลอีกต่อไปแล้ว


person thathurtabit    schedule 07.12.2018    source แหล่งที่มา


คำตอบ (1)


ดูเหมือนว่าฉันกำลังตกอยู่ในหลุมกระต่ายที่ทำให้ตัวเองสับสนกับการกำหนดค่า

ฉันทำให้สิ่งต่าง ๆ ง่ายขึ้นเหลือเพียง:

ด่วน:

const express = require("express");
const app = express();
const http = require("http").createServer(app);
const io = require("socket.io").listen(http);
const { addPlayerIO } = require("./utils/addPlayer.io");

io.on("connection", socket => {
   console.log("a user connected: ", socket.id);
});

http.listen(8080, () => {
  console.log(`Listening on ${http.address().port}`);
});

webpack.config.js

....
plugins: [
    definePlugin,
    new BrowserSyncPlugin({
      host: process.env.IP || "localhost",
      port: process.env.PORT || 3000,
      server: {
        baseDir: ["./", "./dist"]
      }
    })
]
...

เพจฝั่งไคลเอ็นต์ใดๆ

const socketURL = 'http://localhost:8080' // whatever your socket port
const socket = io(socketURL);

socket.on("someEvent", data => {
    console.log(`I can now do something with ${data}`);
});

และผลลัพธ์ก็คือ 404 ทั้งหมดหายไป ฉันไม่แน่ใจ 100% ว่าอะไรเป็นสาเหตุ แม้ว่าการเคลียร์เครื่องของฉันจะช่วยให้แน่ใจว่าสิ่งแปลก ๆ จากการเชื่อมต่อที่ค้างอยู่นั้นถูกหยุดแล้ว

person thathurtabit    schedule 07.12.2018