WebSocket回调来回复消息

时间:2015-12-04 17:13:49

标签: javascript node.js websocket

我正在使用WebSockets进行简单的练习。我有一个NodeJS脚本,它侦听WebSocket,接收文件名,打开文件,并通过WebSocket将文件内容发送回客户端。

以下是代码:

var websocket_server = require('ws').Server;
var server = new websocket_server({port: 1234});

var fs = require('fs');

server.on('connection', function connection(socket)
{
  socket.on('message', function request(file_name)
  {
    fs.readFile(file_name, function(error, data)
    {
      if(error)
        throw error;

      socket.send(data, {binary: true});
    });
  });
});

在客户端,我使用WebSocket加载图像并将其显示在页面中:

<!DOCTYPE html>
<html>
<head>
    <title>My Little Project</title>
    <script type = "text/javascript">
        var ws = new WebSocket("ws://127.0.0.1:1234");
        ws.binarytype = "blob";
        ws.onmessage = function(event)
        {
            var img = document.createElement("img");
            img.src = (window.URL || window.webkitURL).createObjectURL(event.data);
            document.body.appendChild(img);
        }

        ws.onopen = function(event)
        {
            ws.send("image1.jpg")
        }
    </script>
</head>
<body>
</body>
</html>

现在,这个例子运行正常,我很高兴。令我难过的是,我现在想要向服务器询问多个图像,并对每个图像做一些事情。

我知道我可以通过执行以下操作来序列化我的所有请求:

ws.onmessage = function(event)
{
    // Do something with image1.jpg
    ws.onmessage = function(event)
    {
        // Do something with image2.jpg
        // And so on
    }
    ws.send("image2.jpg");
};
ws.send("image1.jpg");

但这是串行的,这增加了开销等等。我想得到的是:

ws.send("image1.jpg", function(event)
{
    // Do something with image1.jpg
});

ws.send("image2.jpg", function(event)
{
    // Do something with image2.jpg
});

// And so on

我不知道如何在客户端或服务器上执行此操作,因此非常感谢任何帮助。

2 个答案:

答案 0 :(得分:1)

为什么不将图像作为json编码的数组发送,然后在服务器端处理它?我没有运行此代码,但应该可以运行。

let images = [
    "image1.jpg",
    "image2.jpg",
];

ws.send(JSON.stringify(images), function(event)
{
    // Do something with images
});

答案 1 :(得分:0)

您应该使用websockets-callback库,它完全可以满足您的需求。

这是演示中包含的代码的一部分:

function onTestProgressClick(){
    var milliseconds = document.getElementById("callbackDelay").value;

    //magic starts here
    wsc.send({cmd: 'progress'},
        function(response){
            document.getElementById("ws_response").innerHTML = 'Progress test completed!';
        },

        function(response){
            document.getElementById("progressBar").value = response.progress;
        }
    )
}