Я уже прошел через некоторые из предложенных решений здесь, в SO, но безуспешно. Это проблема. Когда большой двоичный объект создается с использованием данных, полученных из конечной точки API, я хочу заставить браузер загрузить большой двоичный объект. До сих пор я пробовал три решения, но ни одно из них не работает. Далее следует код. Обратите внимание, что я добавил несколько комментариев в код для дальнейшего объяснения.
const FILE_NAME_REGEX = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
export function Download(url) {
return APICall.get(url).then(response => {
const disposition = response.request.getResponseHeader('Content-Disposition');
//^This line gives the 'Refused to get unsafe header "Content-Disposition"' error, so next few lines won't execute and part with generating anchor is not used, but the part of code under the 'else' branch.
if (disposition && disposition.indexOf('attachment') !== -1) {
const matches = FILE_NAME_REGEX.exec(disposition);
if (matches != null && matches[1]) {
filename = matches[1].replace(/['"]/g, '');
}
}
const type = response.request.getResponseHeader('Content-Type');
const blob = new Blob([response.data], { type });
if (typeof window.navigator.msSaveBlob !== 'undefined') {
window.navigator.msSaveBlob(blob, filename);
} else {
const URL = window.URL || window.webkitURL;
const downloadUrl = URL.createObjectURL(blob);
if (filename) {
const a = document.createElement('a');
if (typeof a.download === 'undefined') {
window.location = downloadUrl;
} else {
a.href = downloadUrl;
a.download = filename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
}
} else {
// 1. soultion
window.location = downloadUrl;
}
setTimeout(() => {
URL.revokeObjectURL(downloadUrl);
}, 100);
}
});
}// 2. решение
const ifrmDownloader = document.createElement('iframe');
ifrmDownloader.setAttribute('src', downloadUrl);
ifrmDownloader.style.width = '0px';
ifrmDownloader.style.height = '0px';
document.body.appendChild(ifrmDownloader);
// 3. решение
window.open(downloadUrl,_blank);
Решение не работает, потому что оно открывает другую вкладку и вместо файла возвращает пустой квадратик. Вероятно, это связано с потерей временного блоба при открытии новой вкладки.
Решение просто не работает, и я не знаю, почему. Iframe добавляется в dom, и запрос записывается на вкладке «Сеть» в консоли разработчика, но загрузка не запускается. Вероятно, та же причина, что и в решении 1. Кроме того, это сообщение регистрируется:
Ресурс интерпретируется как документ, но передается с типом MIME image/png: "blob:https://example.com/e53bf47b-7f39-4758-b3dd-3cc2df5889ad".
- Решение тоже не работает. Во-первых, браузер заблокировал всплывающее окно, а после того, как всплывающее окно разрешено, загрузка файла не начинается.
Я чувствую, что здесь чего-то не хватает, но чего?
