Node.js Electron/NodeJS和setInterval/async代码上的应用程序冻结

Node.js Electron/NodeJS和setInterval/async代码上的应用程序冻结,node.js,multithreading,asynchronous,electron,Node.js,Multithreading,Asynchronous,Electron,我正在开发一个应用程序,它使用electron api每3秒执行一次屏幕截图捕获,并将其写入给定的目标路径。我已经设置了一个单独的浏览器窗口,其中捕获代码在setInterval()循环中运行(请参见下面的代码结构),但每当捕获发生时,应用程序都会冻结片刻。我认为这是对文件ScreenCapturer.jshtml.js中的source.缩略图.toPng()或writeScreenshot()方法的调用 我建立了这个结构,好像我认为这是一条路要走,但显然这不是。WebWorkers也帮不了我,

我正在开发一个应用程序,它使用electron api每3秒执行一次屏幕截图捕获,并将其写入给定的目标路径。我已经设置了一个单独的浏览器窗口,其中捕获代码在setInterval()循环中运行(请参见下面的代码结构),但每当捕获发生时,应用程序都会冻结片刻。我认为这是对文件
ScreenCapturer.jshtml.js
中的
source.缩略图.toPng()或
writeScreenshot()方法的调用

我建立了这个结构,好像我认为这是一条路要走,但显然这不是。WebWorkers也帮不了我,因为我需要节点模块,如fs、path和desktopCapturer(来自electron)

如何在每次间隔代码(如文件
screenpapturer.jshtml.js
中所示)运行时(因为我认为渲染器进程是独立的进程)都不阻塞主线程的情况下执行此类任务


我的代码作为参考 main.js(主进程)

ScreenCapturer.js(主进程使用的模块)

ScreenCapturer.jshtml.js(在渲染器浏览器窗口中加载的thml文件)



我不再使用electron提供的API。我建议使用
桌面截图
软件包->。这对我来说是跨平台的(linux、mac、win)。 注意
windows上
我们需要,否则当使用
asar
打包电子应用程序时,它将无法在
桌面屏幕截图中执行脚本。更多信息请参见危险品包装页面

下面是我的代码现在的大致工作方式,请不要复制/粘贴,因为它可能不适合您的解决方案!!不过,它可能会指示您如何解决此问题

/* ******************************************************************** */
/* MODULE IMPORTS */
import { remote, nativeImage } from 'electron';
import path from 'path';
import os from 'os';
import { exec } from 'child_process';
import moment from 'moment';
import screenshot from 'desktop-screenshot';
/* */
/*/********************************************************************///
/* ******************************************************************** */
/* CLASS */
export default class ScreenshotTaker {    
    constructor() {
        this.name = "ScreenshotTaker";        
    }
    start(cb) {
        const fileName = `cap_${moment().format('YYYYMMDD_HHmmss')}.png`;
        const destFolder = global.config.app('capture.screenshots');
        const outputPath = path.join(destFolder, fileName);        
        const platform = os.platform();
        if(platform === 'win32') {
            this.performWindowsCapture(cb, outputPath);
        }
        if(platform === 'darwin') {
            this.performMacOSCapture(cb, outputPath);
        }
        if(platform === 'linux') {
            this.performLinuxCapture(cb, outputPath);
        }
    }
    performLinuxCapture(cb, outputPath) {
        // debian
        exec(`import -window root "${outputPath}"`, (error, stdout, stderr) => {
            if(error) {
                cb(error, null, outputPath);
            } else {
                cb(null, stdout, outputPath);
            }
        });
    }
    performMacOSCapture(cb, outputPath) {
        this.performWindowsCapture(cb, outputPath);
    }
    performWindowsCapture(cb, outputPath) {
        require('hazardous');
        screenshot(outputPath, (err, complete) => {
            if(err) {
                cb(err, null, outputPath);
            } else {
                cb(null, complete, outputPath);
            }
        });
    }
}
/*/********************************************************************///

我有这个问题too@Booligoosh这确实是一种痛苦,但我放弃了使用它。我建议使用
桌面截图
软件包->。这对我来说是跨平台的(linux、mac、win)。@Booligoosh请看下面我的答案,它可能对你有用
'use strict';

/* ******************************************************************** */
/* IMPORTS */
import { app, BrowserWindow, ipcMain } from 'electron';
import url from 'url';
import path from 'path';
/* VARIABLES */
let rendererWindow;
/*/********************************************************************///
/*///*/

/* ******************************************************************** */
/* SCREENCAPTURER */
export default class ScreenCapturer {
    constructor() {
        rendererWindow = new BrowserWindow({
            show: true, width: 400, height: 600,
            'node-integration': true,
            webPreferences: {
                webSecurity: false
            }
        });                        
        rendererWindow.on('close', () => {
            rendererWindow = null;
        });
    }

    startTakingScreenshots(interval) {
        rendererWindow.webContents.on('did-finish-load', () => {
            rendererWindow.openDevTools();
            rendererWindow.webContents.send('capture-screenshot', path.join('e:', 'temp'));
        }); 
        rendererWindow.loadURL(
            url.format({
                pathname: path.join(__dirname, 'ScreenCapturer.jshtml.html'),
                protocol: 'file:',
                slashes: true
            })
        );                       
    }    
}
/*/********************************************************************///
/*///*/
<html>
    <body>
        <script>require('./ScreenCapturer.jshtml.js')</script>
    </body>
</html>
import { ipcRenderer, desktopCapturer, screen } from 'electron';
import path from 'path';
import fs from 'fs';
import moment from 'moment';
let mainSource;

function getMainSource(mainSource, desktopCapturer, screen, done) {
    if(mainSource === undefined) {
        const options = {
            types: ['screen'],
            thumbnailSize: screen.getPrimaryDisplay().workAreaSize
        };
        desktopCapturer.getSources(options, (err, sources) => {
            if (err) return console.log('Cannot capture screen:', err);
            const isMainSource = source => source.name === 'Entire screen' || source.name === 'Screen 1';
            done(sources.filter(isMainSource)[0]);        
        });
    } else {
        done(mainSource);
    }
}
function writeScreenshot(png, filePath) {
    fs.writeFile(filePath, png, err => {        
        if (err) { console.log('Cannot write file:', err); }
        return;       
    });
}

ipcRenderer.on('capture-screenshot', (evt, targetPath) => {    
    setInterval(() => {          
        getMainSource(mainSource, desktopCapturer, screen, source => {
            const png = source.thumbnail.toPng();
            const filePath = path.join(targetPath, `${moment().format('yyyyMMdd_HHmmss')}.png`);
            writeScreenshot(png, filePath);
        });
    }, 3000);
});
/* ******************************************************************** */
/* MODULE IMPORTS */
import { remote, nativeImage } from 'electron';
import path from 'path';
import os from 'os';
import { exec } from 'child_process';
import moment from 'moment';
import screenshot from 'desktop-screenshot';
/* */
/*/********************************************************************///
/* ******************************************************************** */
/* CLASS */
export default class ScreenshotTaker {    
    constructor() {
        this.name = "ScreenshotTaker";        
    }
    start(cb) {
        const fileName = `cap_${moment().format('YYYYMMDD_HHmmss')}.png`;
        const destFolder = global.config.app('capture.screenshots');
        const outputPath = path.join(destFolder, fileName);        
        const platform = os.platform();
        if(platform === 'win32') {
            this.performWindowsCapture(cb, outputPath);
        }
        if(platform === 'darwin') {
            this.performMacOSCapture(cb, outputPath);
        }
        if(platform === 'linux') {
            this.performLinuxCapture(cb, outputPath);
        }
    }
    performLinuxCapture(cb, outputPath) {
        // debian
        exec(`import -window root "${outputPath}"`, (error, stdout, stderr) => {
            if(error) {
                cb(error, null, outputPath);
            } else {
                cb(null, stdout, outputPath);
            }
        });
    }
    performMacOSCapture(cb, outputPath) {
        this.performWindowsCapture(cb, outputPath);
    }
    performWindowsCapture(cb, outputPath) {
        require('hazardous');
        screenshot(outputPath, (err, complete) => {
            if(err) {
                cb(err, null, outputPath);
            } else {
                cb(null, complete, outputPath);
            }
        });
    }
}
/*/********************************************************************///