低质量angular电子截图

Question

我需要截屏以便显示或保存，我正在尝试这样做：

this._electronService.desktopCapturer.getSources({types: ['screen']}).then(async sources => {
  this.image = this.sanitizer.bypassSecurityTrustResourceUrl(sources[0].thumbnail.toDataURL());
});

如果我这样做，我会得到一个缩小的图像，我什么都看不到。我附上了我得到的捕获样本。如果我设置更大的宽度或高度，图像会像素化。

此外，我需要保存这个 img，我试过这个：

writeContents(content, fileName, contentType) {
    let a = document.createElement('a');
    let file = new Blob([content], {type: contentType});
    a.href = URL.createObjectURL(file);
    a.download = fileName;
    a.click();
}

Answer 1

解决方案很简单，只需添加一个新选项来指示捕获的大小，默认情况下它很小，这就是它看起来像这样的原因。一个例子：

this._electronService.desktopCapturer.getSources(
{
    types: ['screen'],
    thumbnailSize: {
        height: 720,
        width: 1000
    }
}).then(async sources => {
  this.image = this.sanitizer.bypassSecurityTrustResourceUrl(sources[0].thumbnail.toDataURL());
});

低质量angular电子截图

Low quality angular electron screenshot

angular

image

electron

desktop-application

screen-capture