我正在尝试使用socket.io 和node.js 从客户端向服务器发出鼠标单击事件。问题是，发出后，我发送的字典没有作为一个整体发送。这是我的代码:
客户端:
document.addEventListener('click', function(event){
console.log("event sent", event.target,event);
var target = event.target;
var myClick = {id: target, event: event};
console.log(myClick);
socket.emit('myClick', myClick);
})
socket.on('myClick', function(data){
console.log("event received", data);
document.querySelectorAll(data.id).dispatchEvent(data.event);
});
在正文上注册点击事件后，控制台会记录此信息:
event sent <body>…</body>
MouseEvent {isTrusted: true, screenX: 1145, screenY: 499, clientX: 1040, clientY: 398…}
Object {id: body, event: MouseEvent}
其他页面在收到事件后记录此事件:
event received Object {id: Object, event: Object}
但是，扩展对象给我们带来了这个:
event: Object
isTrusted: true
__proto__: Object
id: Object
__proto__: Object
__proto__: Object
因此它没有接收整个事件，并且 id 没有事件目标。
服务器端:
io.sockets.on('connection', function (socket) {
console.log("socket connected");
console.log(socket);
socket.on('myClick', function (data) {
console.log("myClick in server.js");
console.log(socket);
console.log(data);
socket.broadcast.emit('myClick', data);
});
});
当服务器在“myClick”上收到某些内容时，它会打印出以下内容:
myClick in server.js
{ id: {}, event: { isTrusted: true } }
正如您所看到的，目标是空的，而应该是完整的事件对象只有 isTrusted 值。以前有人遇到过这个问题吗？任何帮助，将不胜感激。我尝试执行此操作的方式基于 this Stack Overflow 的答案，但他们使用的是 jQuery，而我只使用 Javascript。
最佳答案
socket.io 尝试将您传递给它的参数转换为 JSON。有些内容(例如 DOM 对象)无法转换为 JSON，并且会触发错误或导致内容被忽略。因此，您无法发送 event.target。它是一个 DOM 对象，您无法将 DOM 对象发送到您的服务器。您必须发送可以转换为字符串的内容。例如，您可以发送 event.target.id。
我建议您不要尝试发送整个 event 对象，该对象包含许多无法发送的内容(例如 DOM 对象)，而是创建一个新对象并仅复制您实际需要发送的属性。并且，请确保您发送的内容不包含 DOM 对象，也不包含任何循环引用或其他无法转换为 JSON 的内容。
我不知道您需要 event 对象中的哪些属性，但总体思路如下:
document.addEventListener('click', function(event){
// create new object with just the things we need from the event object
// this must contain only things that can be converted into JSON
var clickData = {
id: event.target.id,
timeStamp: event.timeStamp,
type: event.type,
clientX: event.clientX,
clientY: event.clientY
};
socket.emit('myClick', clickData);
});
关于javascript - 使用socket.io发送鼠标点击事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39296328/