15

我想实现网络工作者之间的通信。我阅读了 W3C 文档，发现MessageChannel是其中一种方法，但是在阅读 MessageChannel 时，我无法理解如何使用 messagechannel 实现工作人员之间的通信。

我从 MSDN 得到这个

http://msdn.microsoft.com/en-in/library/ie/hh673525(v=vs.85).aspx

这里也没有适当的文档来做到这一点。

我需要知道，如何使用 MessageChannel 与 webworkers 通信？

这是抛出 DATA_CLONE_ERR 的演示

var worker = new Worker("sub1_worker.js");
    worker.onmessage = function(e) {
        $("#log").append("<br>" + e.data);
    }
    var channel = new MessageChannel();

    worker.postMessage("ping", [channel.port2]);

    channel.port1.onmessage = function(event) {
        // Message is in event.data
        alert("Message is: " + event.data);
    }

    channel.port1.postMessage('hello');



    $("#send1").click(function() {
        var msg = $("#msg").val();
        if (msg && msg != "start")
            worker.postMessage("ping2");

        $("#msg").val("");

    })
    $("#send2").click(function() {
        var msg = $("#msg").val();
        if (msg && msg != "start")
            worker.postMessage("ping3",[channel.port2]);
        $("#msg").val("");

    })

和工人

onmessage = getMessage;

function getMessage(e){

    if(e.ports[0])
    e.ports[0].postMessage("msg from sub worker 1 "+ e.data);
    else
    postMessage("msg from sub worker 1 "+ e.data);
}
4

3 回答 3

13

这是一个纯 javascript 中的干净示例，说明如何在两个工作人员之间进行设置：

在主线程中：

function setup(){
    var channel = new MessageChannel();
    var worker1 = new Worker("worker1.js");
    var worker2 = new Worker("worker2.js");

    // Setup the connection: Port 1 is for worker 1
    worker1.postMessage({
        command : "connect",
    },[ channel.port1 ]);

    // Setup the connection: Port 2 is for worker 2
    worker2.postMessage({
        command : "connect",
    },[ channel.port2 ]);

    worker1.postMessage({
        command: "forward",
        message: "this message is forwarded to worker 2"
    });
}

在worker1.js：

var worker2port;
var onMessageFromWorker2 = function( event ){
    console.log("Worker 1 received a message from worker 2: " + event.data);

    //To send something back to worker 2
    //worker2port.postMessage("");
};

self.onmessage = function( event ) {
    switch( event.data.command )
    {
        // Setup connection to worker 2
        case "connect":
            worker2port = event.ports[0];
            worker2port.onmessage = onMessageFromWorker2;
            break;

        // Forward messages to worker 2
        case "forward":
            // Forward messages to worker 2
            worker2port.postMessage( event.data.message );
            break;

        //handle other messages from main
        default:
            console.log( event.data );
    }
};

在worker2.js

var worker1port;
var onMessageFromWorker1 = function( event ){
    console.log("Worker 2 received a message from worker 1: " + event.data);

    //To send something back to worker 1
    //worker1port.postMessage("");
};

    self.onmessage = function( event ) {
    switch( event.data.command )
    {
        // Setup connection to worker 1
        case "connect":
            worker1port = event.ports[0];
            worker1port.onmessage = onMessageFromWorker1;
            break;

        // Forward messages to worker 1
        case "forward":
            // Forward messages to worker 1
            worker1port.postMessage( event.data.message );
            break;

        //handle other messages from main
        default:
            console.log( event.data );
    }
};

这展示了如何处理来自主线程的消息，如何将消息从主线程转发到另一个工作线程，以及如何在不涉及主线程的情况下直接在工作线程之间进行通信。

于 2015-12-10T09:49:27.197 回答
3

您的演示实际上对我有用（Chrome 23.0.1271.101）。如果我点击第二个“发送给副工”按钮，我只会得到 DATA_CLONE_ERR。这可能是意料之中的。在您创建频道后，您已经通过第一个电话port2将您的信息发送MessageChannel给了工作人员。postMessage再次发送它可能是非法的，尽管我也找不到任何关于此的明确文档。

您可能想要做的是onmessage在工作人员接收的端口上设置，然后您可以处理将来通过该端口发送的消息。就像是：

onmessage = getMessage;

function getMessage(e){
  if(e.ports[0]) {
    var receivedPort = e.ports[0];
    receivedPort.postMessage("msg from sub worker 1 "+ e.data);
    receivedPort.onmessage = getPortMessage
  }
  else
    postMessage("msg from sub worker 1 "+ e.data);
}

function getPortMessage(e) {
  // Messages sent through the port will be handled here
}
于 2013-01-08T02:50:40.257 回答
1

在 MessageChannel API 上工作了一段时间之后。我得到了使用 MessageChannel 与网络工作者交流的解决方案。这是工作代码的演示。

于 2013-01-08T11:47:23.857 回答