'ws：// localhost：3000 /'的WebSocket連接失敗：連接在收到握手響應之前關閉

Question

我參加了一個我的朋友製作的遊戲，並希望通過在具有WebRTC的對等點之間發送按鍵數據， WebSockets的。不過，我得到這個錯誤在控制檯：

WebSocket連接到「WS：//本地主機：3000 /」失敗：收到握手迴應

我的服務器文件具有以下前連接關閉幾行字：

'use strict'; 

const express = require('express'); 
const SocketServer = require('ws').Server; 
const path = require('path'); 

const PORT = process.env.PORT || 3000; 
const INDEX = path.join(__dirname, 'index.html'); 

const server = express(); 

server.use(express.static(path.join(__dirname, 'lib'))); 
server.use('/assets', express.static(path.join(__dirname, 'assets'))); 
server.listen(PORT,() => console.log(`Listening on ${ PORT }`)); 

const wss = new SocketServer({ server }); 
var users = {}; 
let usernames = []; 


wss.on('connection', function(connection) { 

    connection.on('message', function(message) { 

     var data; 
     try { 
     data = JSON.parse(message); 
     } catch (e) { 
     console.log("Invalid JSON"); 
     data = {}; 
     } 

     switch (data.type) { 
     case "login": 
      console.log("User logged", data.name); 
      if(users[data.name]) { 
       sendTo(connection, { 
        type: "login", 
        success: false 
       }); 
      } else { 
       users[data.name] = connection; 
       connection.name = data.name; 
       usernames.push(data.name); 

       sendTo(connection, { 
        type: "login", 
        success: true, 
        users: usernames 
       }); 
      } 

      break; 

     case "offer": 
      console.log("Sending offer to: ", data.name); 
      var conn = users[data.name]; 

      if(conn != null) { 
       connection.otherName = data.name; 

       sendTo(conn, { 
        type: "offer", 
        offer: data.offer, 
        name: connection.name 
       }); 
      } 

      break; 

     case "answer": 
      console.log("Sending answer to: ", data.name); 
      var conn = users[data.name]; 

      if(conn != null) { 
       connection.otherName = data.name; 
       sendTo(conn, { 
        type: "answer", 
        answer: data.answer 
       }); 
      } 

      break; 

     case "candidate": 
      console.log("Sending candidate to:",data.name); 
      var conn = users[data.name]; 

      if(conn != null) { 
       sendTo(conn, { 
        type: "candidate", 
        candidate: data.candidate 
       }); 
      } 

      break; 

     case "leave": 
      console.log("Disconnecting from", data.name); 
      var conn = users[data.name]; 
      conn.otherName = null; 

      if(conn != null) { 
       sendTo(conn, { 
        type: "leave" 
       }); 
      } 

      break; 

     default: 
      sendTo(connection, { 
       type: "error", 
       message: "Command not found: " + data.type 
      }); 

      break; 
     } 
    }); 

和連接的客戶端如下所示：

const Game = require("./game"); 
const GameView = require("./game_view"); 
var HOST = location.origin.replace(/^http/, 'ws'); 
console.log('host: ', HOST); 
console.log(process.env.PORT); 

document.addEventListener("DOMContentLoaded", function() { 
    const connection = new WebSocket(HOST); 

..... 

這是發生在錯誤的位置，這是抓住了錯誤，我得到：

bubbles 
: 
false 
cancelBubble 
: 
false 
cancelable 
: 
false 
composed 
: 
false 
currentTarget 
: 
WebSocket 
defaultPrevented 
: 
false 
eventPhase 
: 
0 
isTrusted 
: 
true 
path 
: 
Array(0) 
returnValue 
: 
true 
srcElement 
: 
WebSocket 
target 
: 
WebSocket 
timeStamp 
: 
213.01500000000001 
type 
: 
"error" 
__proto__ 
: 
Event 

我不是太熟悉服務器端編程，並試圖理解。我試圖查找這個問題，但它看起來像各種不同的事情可以導致這一點。如果你想看到的版本庫，你可以看到和自己嘗試（使用的WebPack）：

Answer 1

混亂從這裏開始：

const server = express(); 

的express功能並沒有真正恢復的服務器，它返回一個應用。通常，用於此的變量是app，但這當然不過是約定（即不是要求）。

但是，當你通過應用到WS服務器就成爲一個問題：

const wss = new SocketServer({ server }); 

這是因爲SocketServer需要一個HTTP服務器實例，這server不是。

這裏有一個修復，但不重命名你的變量：

let httpServer = server.listen(PORT,() => console.log(`Listening on ${ PORT }`)); 
... 
const wss = new SocketServer({ server : httpServer }); 

（因爲當你在Express實例調用.listen()，它會返回一個HTTP服務器實例）

使用變量命名約定它會是這樣的：

const app = express(); 

app.use(express.static(path.join(__dirname, 'lib'))); 
app.use('/assets', express.static(path.join(__dirname, 'assets'))); 

let server = app.listen(PORT,() => console.log(`Listening on ${ PORT }`)); 

const wss = new SocketServer({ server });