Как я могу загрузить изображение в браузере без внешних пакетов? - PullRequest
0 голосов
/ 29 августа 2018

Единственный способ получить изображение в браузере - открыть его в новом окне. Но я хочу, чтобы браузер загрузил его. Я перешел на новый HttpClient и теперь не могу этого сделать.

Я искал в Интернете, и есть два варианта:

Создание элемента привязки с display: none и динамическое добавление URL-адреса в href. Но тогда я должен использовать DOMSanitizer с bypassSecurityTrustUrl(), и это угроза безопасности, поэтому я не могу использовать это.

OR

Используйте пакет filesave.js, но в нашем проекте мы хотим попытаться избежать пакетов, и он использует оперативную память, поэтому для больших файлов это не вариант. Streamsaver.js не поддерживается в FF и Edge, поэтому также нет опции.

Раньше я делал это со старым HTTP-модулем Angular <4, и он просто загружал его без вопросов: </p>

const subscription = this.downloadService.downloadFile(id, this.file.folderId).subscribe(data => {
    window.location.href = data.url;
    subscription.unsubscribe();
}, error => {
    console.log(error);
});

Теперь я делаю это так, но открывается новая вкладка, которая в Chrome автоматически блокируется:

const sub = this.downloadService.downloadFile(downloadArray, this.folders.id).subscribe(data => {
    const blob = new Blob([data], { type: 'image/png' });
    const blobUrl = window.URL.createObjectURL(blob);
    const winOpen = window.open(blobUrl);
    sub.unsubscribe();

}, error => {
    console.log(error);
});

Так что просто хочу сделать что-то вроде этого:

window.download(blobUrl);

И покончим с этим. Почему это так сложно? Есть проблемы с безопасностью или что-то? Я действительно не понимаю.

1 Ответ

0 голосов
/ 11 сентября 2018

После долгой борьбы я нашел проблему, по крайней мере, для себя. Я использовал плагин для блокировки рекламы (источник uBlock), который, по-видимому, блокирует URL-адреса BLOB-объектов. На самом деле, кажется, что все блокировщики рекламы делают это по умолчанию. Отключение блокировщика рекламы на моем локальном хосте (или на любом другом веб-сайте, на котором вы развернули) решило эту проблему для меня.

Подробнее об этом можно прочитать здесь: Почему блокировщики рекламы блокируют BLOB-объекты?

...