Websocket - 浏览器websocket没有收到来自服务器的消息

我用Node构建了一个websocket服务器和客户端，两者都正常工作。但是，我在单个html页面上构建了一个客户端，并且在那里，当我从浏览器调用sendUTF时，websocket正在监听消息。浏览器客户端不能读取节点客户端发送的消息。这是一个安全问题/功能还是我愚蠢？Websocket - 浏览器websocket没有收到来自服务器的消息

Server代码：

var WebSocketServer = require('websocket').server; 
var http = require('http'); 

var server = http.createServer((req, res) => { 
    console.log((new Date()) + ' Received request for ' + request.url); 
    res.writeHead(404); 
    res.end(); 
}); 

server.listen(8080,() => { 
    console.log((new Date()) + ' Server is listening on port 8080'); 
}); 

wsServer = new WebSocketServer({ 
    httpServer: server, 
    // You should not use autoAcceptConnections for production 
    // applications, as it defeats all standard cross-origin protection 
    // facilities built into the protocol and the browser. You should 
    // *always* verify the connection's origin and decide whether or not 
    // to accept it. 
    autoAcceptConnections: false 
}); 

function originIsAllowed(origin) { 
    // put logic here to detect whether the specified origin is allowed. 
    return true; 
} 

wsServer.on('request', (request) => { 
/* if (!originIsAllowed(request.origin)) { 
     // Make sure we only accept requests from an allowed origin 
     request.reject(); 
     console.log((new Date()) + ' Connection from origin ' + request.origin + ' rejected.'); 
     return; 
    }*/ 

    var connection = {}; 
    try { 
     connection = request.accept('echo-protocol', request.origin); 
     console.log((new Date()) + ' Connection accepted.'); 
     connection.on('message', function(message) { 
      if (message.type === 'utf8') { 
       console.log('Received and send Message: ' + message.utf8Data); 
       connection.sendUTF(message.utf8Data); 
      } 
      else if (message.type === 'binary') { 
       console.log('Received Binary Message of ' + message.binaryData.length + ' bytes'); 
       connection.sendBytes(message.binaryData); 
      } 
      else { 
       console.log('Received unknown format message: ' + message); 
       connection.send(message); 
      } 
     }); 

     connection.on('close', function(reasonCode, description) { 
      console.log((new Date()) + ' Peer ' + connection.remoteAddress + ' disconnected.'); 
     });   
    } 
    catch(e) { 
     console.error("Client fail trying to connect to websocket: " + e); 
    } 


});

节点客户端代码：

var express = require('express'); 
var app = express(); 
server = require('http').createServer(app); 
var WebSocketClient = require('websocket').client; 

var kinect = new Kinect2(); 

app.use(express.static(__dirname + 'js/View')); 
//app.use(express.static(__dirname + 'js/Script')); 

//instance of WebSocket object 
var wsClient = new WebSocketClient(); 

//Websocket connection events 
wsClient.on('connectFailed', function(error) { 
    console.log('Connect Error: ' + error.toString()); 
    process.exit(0); 
}); 

wsClient.on('connect',(connection) => { 


    connection.on('error', (error) => { 
     console.error("Connection Error: " + error.toString()); 
     process.exit(0); 
    }); 

    connection.on('close',() => { 
     console.log("Websocket connection is closed!"); 
    }); 

    // connection.on('message',(message) => { 
    // if (message.type === 'utf8') { 
    //  console.log("Received: '" + message.utf8Data + "'"); 
    // } 
    // }); 
    console.log('Websocket connection OK!'); 

    setInterval(() => { 
     console.log("sending message..."); 
     connection.send("This is a test!"); 
    },1000); 
    //startKinect(connection); 

}); 

wsClient.connect('ws://127.0.0.1:8080','echo-protocol');

最后我的浏览器客户端

<!DOCTYPE html> 
<html> 
<head> 
    <title> 
     Websocket test 
    </title>              
</head> 
<body> 
    <h1>Websocket client test</h1> 

    <script> 
     console.log("Open Websocket..."); 
     var websocket = new WebSocket('ws://127.0.0.1:8080','echo-protocol'); 

     websocket.onopen = function() { 
      console.log("websocket was open"); 
      //websocket.send('Websocket is working(I gess)'); 
     }; 

     websocket.onclose =() => { 
      console.log("Websocket was closed!"); 
     } 

     websocket.onerror = (error) =>{ 
      console.error("Websocket error: " + JSON.stringify(error)); 
     }; 

     websocket.onmessage = (message) => { 
      // Web Socket message: 

      console.log("MSG: " + message.data); 


     }; 

     websocket.addEventListener('message',(e) => { 
      websocket.onmessage(e); 
     }) 

    </script> 

</body> 
</html>

欢迎任何帮助！谢谢！

来源

2017-08-15 Andre Carneiro

如果我理解正确，您正试图通过WebSockets从节点客户端与浏览器客户端进行通信？这不是明确可能的，因为WebSockets使用服务器来进行服务器和客户端之间的双工通信，而不是客户端和客户端。然而，似乎在与WebSockets的P2P通信方面有一些进步，可能会帮助你：https://stackoverflow.com/questions/4118272/do-websockets-allow-for-p2p-browser-to-browser-communication –

不，不是那样！有一个websocket和两个客户端的服务器。 nodejs客户端是“生产者”并写入websocket。浏览器客户端是“消费者”，它应该能够从websocket中读取，除非我的概念是错误的。 –

您的服务器作为echo（客户端 - >服务器 - >客户端）工作，但是您描述的是广播（客户端 - >服务器 - >客户端s）。你应该保留客户的参考资料，然后发送给所有客户。

的request事件处理程序之外，添加：

var connections = [];

后您接受请求，添加连接到阵列：

connections.push(connection);

然后当你想将数据发送给大家，通过连接循环：

for (var i = 0; i < connections.length; i++) 
    connections[ i ].sendUTF(message.utf8Data);

来源

2017-08-15 20:14:21 vox

感谢您的回答！但是我不明白，如果这个对象仅仅因为'request'对象（或者我不明白你写了什么）而存在，我怎么能在'request'事件之外使用'connection'对象？你能解释一下吗？ –

看来我想念'广播'部分。幸运的是，'ws'模块让我可以轻松地做到这一点！

const WebSocket = require('ws'); 
var port = 8080; 
const wss = new WebSocket.Server({ "port": port }); 

// Broadcast to all. 
wss.broadcast = function broadcast(data) { 
    wss.clients.forEach(function each(client) { 
    if (client.readyState == WebSocket.OPEN && data != undefined) 
     client.send(data); 
    }); 
}; 

wss.on('connection', function connection(ws) { 
    console.log("CONNECTION OK..."); 
    ws.on('message', function incoming(data) { 
    // Broadcast to everyone else. 
    wss.broadcast(data); 
    }); 
});

来源

2017-08-16 11:47:57

Websocket - 浏览器websocket没有收到来自服务器的消息

回答

相关问题