'ws：// localhost：3000 /'へのWebSocketの接続に失敗しました：ハンドシェイクの応答を受け取る前に接続が閉じられました

Question

友人が作ったゲームを取って、WebRTCとピア間でキー押しのデータを送信し、ウェブソケット。しかし、私は、コンソールにこのエラーが出ます：「：// localhostを：WS 3000 /」に

のWebSocket接続を失敗しました：接続には、私のサーバーのファイルには、以下があります

ハンドシェイク応答を受信する前に閉じ数行：

'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サーバにアプリケーションを渡す際に問題になる：

SocketServerは serverではありませんHTTPサーバーのインスタンスを、必要とするためです

const wss = new SocketServer({ 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 });