Socket.io - GET mengembalikan 404 (Tidak Ditemukan) (polling-xhr)

Saya telah melihat pertanyaan serupa diajukan di sini, namun sejauh ini saya belum dapat menemukan solusi untuk masalah saya - saya mungkin akan sedikit gila sekarang.

Saya mencoba memanfaatkan socket.io, dan sejauh ini telah menyiapkan server ekspres dan menjalankan socket.io di server, dan di sisi klien (socket.io-client) .

Sayangnya ketika saya mencoba berkomunikasi dengan server dari sisi klien, saya langsung mengalami kesalahan 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)
...

Pada dasarnya BrowserSync saya akan berjalan di localhost:3000 dan express/socket.io saya akan berjalan di localhost:8080

Penyiapan ekspres saya terlihat seperti ini:

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"]
      }
    })
]
...

Saya menggunakan

(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",

Saya akan sangat berterima kasih atas bantuan apa pun dalam hal ini karena tidak ada lagi yang masuk akal.


person thathurtabit    schedule 07.12.2018    source sumber


Jawaban (1)


Sepertinya saya jatuh ke dalam lubang kelinci karena membingungkan diri saya dengan konfigurasi.

Saya menyederhanakan semuanya kembali menjadi:

ekspres:

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"]
      }
    })
]
...

Halaman sisi klien mana pun

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}`);
});

Dan hasilnya adalah semua 404 hilang. Saya tidak 100% yakin apa penyebabnya, meskipun membersihkan mesin saya memastikan segala keanehan dari koneksi yang tersisa dapat dihentikan.

person thathurtabit    schedule 07.12.2018