Как загрузить изображения из процесса Electron в приложение Angular?

Question

Я пытаюсь сделать следующее:

• Загрузка изображений с помощью Electron с использованием dialog и получение массива URL-адресов путей.

• Использование map для замены каждого элемента в массиве путем чтения файлов с fs и использования base64

• отправка массива в угловое приложение в электронном приложении с использованием аргумента event от Electrons dialog

• с использованием службы и наблюдаемой в угловом режиме для прослушивания массива с использованием IpcRenderer

• подписаться на наблюдаемый в компоненте и сделать массив общедоступным (для html-директив), присваивая переменной.

• с использованием директив html и *ngFor для вывода списка всех изображений с тегами img с помощью директивы src html, проходящих по переменной с URL-адресами base64 и использующими их в качестве src.

Что я пробовал:

Это решение должно работать из того, что я прочитал, но это не так, и я не знаю почему.

электронное приложение

ipcMain.on('showOpenDialog', (event) => {

    const dialogOptions = {
        filters: [{
            name: 'images',
            extensions: ['jpg', 'png']
        }]
    }

    dialog.showOpenDialog(dialogOptions, files => {
        let fileList = files.map(file => fs.readFileSync(file, 'base64'));

        event.sender.send('files', fileList);
    });

});

компонент приложения

this._ipc.getFiles()
            .subscribe(files => {
                this.images = files;
            })

HTML

<div class="image" *ngFor="let image of images">
        <img [src]="image">
</div>

но я получаю ошибку GET в консоли. Хотя он помещает URL-адрес base64 в src, и если я скопирую его и вставлю в онлайн-ридер base64, он выдаст правильное изображение.