Указатель мыши WebRTC

Question

Указатель мыши WebRTC

1

Скажем, у нас есть связь от A до B с webRTC. B также видит свою собственную веб-камеру в окне. Можно ли просмотреть стрелку мыши A в окне B, где отображается его собственная веб-камера?

(поэтому, если Алиса связана с Бобом, Алиса может использовать свой указатель, чтобы указать Бобу, где находится ложка в кухне Боба).

Diego 06 июнь 2017, в 13:22

Источник

Теги:

javascript

html5

webrtc

2 ответа

Ещё вопросы

jib · Answer 1 · 2017-06-06T21-30-00.000Z

Используйте канал данных для отправки координат указателя мыши от A до B:

var pc1 = new RTCPeerConnection(), pc2 = new RTCPeerConnection();

pc1.onicecandidate = e => pc2.addIceCandidate(e.candidate);
pc2.onicecandidate = e => pc1.addIceCandidate(e.candidate);
pc1.onnegotiationneeded = e =>
  pc1.createOffer().then(d => pc1.setLocalDescription(d))
  .then(() => pc2.setRemoteDescription(pc1.localDescription))
  .then(() => pc2.createAnswer()).then(d => pc2.setLocalDescription(d))
  .then(() => pc1.setRemoteDescription(pc2.localDescription))
  .catch(e => console.log(e));

var dc = pc1.createDataChannel("mouse position");
document.onmousemove = e => dc.send(e.x + ", " + e.y);

pc2.ondatachannel = ({channel}) => channel.onmessage = e => console.log(e.data);

<div id="div"></div>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>

Затем визуализируйте его в JavaScript на другом конце. Низкая латентность важна при взаимодействии со сверстниками.

Koby Douek · Answer 2 · 2017-06-06T09-45-00.000Z

Этот вопрос не имеет ничего общего с WebRTC: ваше решение может быть реализовано с помощью Javascript, но я боюсь, что это будет очень сложно реализовать.

Я бы предложил открыть другой одноранговый канал или канал от одного клиента к другому и отправить координаты указателя мыши на событие canvas.onmousemove.