在Atom Electron中,可以将BrowserWindow中以60fps渲染的元素图像真实的复制到其他多个BrowserWindow中。
iyzzxitl1#
选项一:使用window.open()
window.open()
截至2017年5月,现在可以使用window.open()在Electron中打开一个新窗口,其方式与nwjs类似。这意味着无需担心通过不同进程发送图像。有关详细信息,请参阅电子文档。在新窗口中使用对画布的DOM引用,您可以轻松地在每一帧中从旧画布复制图像。
newCanvas.drawImage(oldCanvas, 0, 0, width, height)
选项二:使用WebRTC
您可以通过WebRTC在两个窗口之间本地从画布到视频元素进行流。我的解决方案是基于对related question和有用的WebRTC canvas example的回答。打开下面的两个链接并单击连接。要流式传输的画布:https://jsfiddle.net/f5y48hcd/26/
var stream = canvas.captureStream(); ... stream.getTracks().forEach( function(track) { pc.addTrack( track, stream ); } );
接收流的视频元素:https://jsfiddle.net/rfqhwo4z/10/
pc.ontrack = gotRemoteStream; ... function gotRemoteStream(e) { if (video.srcObject !== e.streams[0]) { video.srcObject = e.streams[0]; } }
请注意,您需要画布选项卡积极运行,它是动画上的视频选项卡。我还没在电子模型上测试过
5fjcxozz2#
如何创建一个Unix套接字和管道的字节,并阅读它从您的其他进程?:
var net = require('net'); // This server listens on a Unix socket at /var/run/mysocket var unixServer = net.createServer(function(client) { // Do something with the client connection }); unixServer.listen('/var/run/mysocket');
https://nodejs.org/api/net.html否则,您可以在端口上打开一个套接字并通过该套接字进行通信。您不希望数据从BrowserWindow来回传递到主进程的主要原因是,您的BrowserWindow处理窗口位置和操作系统事件等内容,因此您不希望通过数据流来减慢它。
2条答案
按热度按时间iyzzxitl1#
选项一:使用
window.open()
截至2017年5月,现在可以使用
window.open()
在Electron中打开一个新窗口,其方式与nwjs类似。这意味着无需担心通过不同进程发送图像。有关详细信息,请参阅电子文档。在新窗口中使用对画布的DOM引用,您可以轻松地在每一帧中从旧画布复制图像。选项二:使用WebRTC
您可以通过WebRTC在两个窗口之间本地从画布到视频元素进行流。我的解决方案是基于对related question和有用的WebRTC canvas example的回答。打开下面的两个链接并单击连接。
要流式传输的画布:https://jsfiddle.net/f5y48hcd/26/
接收流的视频元素:https://jsfiddle.net/rfqhwo4z/10/
请注意,您需要画布选项卡积极运行,它是动画上的视频选项卡。我还没在电子模型上测试过
5fjcxozz2#
如何创建一个Unix套接字和管道的字节,并阅读它从您的其他进程?:
https://nodejs.org/api/net.html否则,您可以在端口上打开一个套接字并通过该套接字进行通信。
您不希望数据从BrowserWindow来回传递到主进程的主要原因是,您的BrowserWindow处理窗口位置和操作系统事件等内容,因此您不希望通过数据流来减慢它。