Js 事件对象未通过对等连接发送答案

【问题标题】：Js event object is not being send via peer to peer connectionJs 事件对象未通过对等连接发送
【发布时间】：2017-09-01 12:49:06
【问题描述】：

我正在尝试实现协同浏览en.wikipedia.org/wiki/Cobrowsing .

我是这样实现的：-

建立对等连接。
从一个节点向另一个节点发送 js 事件对象。（如点击对象）
模拟其他对等方接收到的事件。

我已成功建立点对点连接。

现在我在一端捕获 js 事件，如下所示：-

document.getElementById('mimic').addEventListener('click', function(e) {
            document.getElementById('mimic').style = 'color:red;';
            dataChannel.send(e);
        }, true);

在另一端，我将事件重新创建如下：-

receiveChannel.onmessage = function(event){
                    var target = event.data.target;
                    target.dispatchEvent(event.data);
                  };

问题是事件没有重新创建。

我认为问题可能与发送事件对象有关。所以我想到将事件对象作为字符串发送。但我遇到了一个奇怪的行为。

如果我在控制台记录事件对象，即console.log(e);，我会得到：-

click { target: <button#mimic>, buttons: 0, clientX: 29, clientY: 169, layerX: 29, layerY: 169 }

如果我对事件对象进行字符串化，即console.log(json.stringify(e));，我得到：-

{"isTrusted":true}

我不明白为什么 stringify 会出现这种行为。

注意：-
可用的协同浏览解决方案成本高昂，而且曾经的开源软件功能并不丰富。

我已经全部研究过了。

如果有人认为我做错了，请随时指出我。

【问题讨论】：

我不知道 pears 能够发送任何数据 *.* ！
"模拟其他梨接收到的事件。"?你是说其他苹果吗？
我们可以使用 RTCDataChannel 通过 webRTC 发送数据。 html5rocks.com/en/tutorials/webrtc/basics/#toc-rtcdatachannel
顺便说一句，您无法传播事件，因为目标在每一侧都不相同，即使它们来自相同的代码。 IMO，您应该发送目标对象的 ID 和附加的数据，以最终将事件（或直接调用正确的方法？）传播到您发送的 ID 设计的元素。
@rahul：我猜你没有得到提示：This is a "Pear"。你说的是一个“Peer”。

标签： javascript jquery dom-events

【解决方案1】：

不，你不能像它本身一样发送事件！通过数据通道发送的消息/对象将被序列化，并且某些对象（如 dom 元素）无法序列化。您可以发送如下数据：

var obj = {type : 'click'};//init your object as the known format
dataChannel.send(JSON.stringify(obj));

并收到这样的消息：

dataChannel.onmessage = function(e){
  var json = JSON.parse(e.data);

  var type = json.type;
  //write your logic based on the json object format
  //..............
}

在e.target之间是不同的一个页面！您不能将一个元素从一个发送到另一个，您可以发送它的 id 值并在另一个对等的 html 页面上选择目标元素。

【讨论】：