получить ответный BLOB-объект как объект HTML-данных объекта в ребре - PullRequest
0 голосов
/ 21 июня 2019

На моем веб-сайте HTML5 + JS я вызываю веб-сервис, совершая HTTP-вызов GET с некоторыми значениями заголовка.Этот вызов возвращает двоичный файл PDF.Моя цель - показать PDF пользователю.Следующий код хорошо работает в Chrome, но не в Edge.В крайнем случае он выдает ошибку «Отказано в доступе».Могу ли я использовать обход для края?

Я не могу установить URL-адрес непосредственно для данных объекта или src тега embed, поскольку веб-сервис требует наличия определенных значений заголовка.

fetch(someUrl,{headers:someHeaders})
.then(response=>{return response.blob();})
.then(blob=>{
    pdfObject = document.createElement('object');
    pdfObject.type = 'application/pdf';
    pdfObject.data = URL.createObjectURL(blob);
});

Ожидается: PDF отображается Фактически: «Доступ запрещен» в консоли инструментов разработчика

1 Ответ

0 голосов
/ 21 июня 2019

На это уже много раз отвечали в прошлом.Вот функция, которая обрабатывает загрузку BLOB-объектов.Я использую это в нескольких производственных системах.В число протестированных браузеров входят IE9 +, Edge, Chrome, Firefox:

async function showBlobInBrowser(blob, fileName) {
    return new Promise((resolve, reject) => {
        try {
            if (navigator.msSaveOrOpenBlob) {
                navigator.msSaveOrOpenBlob(blob, fileName);
                resolve()
            } else if (window.navigator.msSaveBlob) {
                window.navigator.msSaveBlob(blob, fileName);
                resolve()
            } else {
                const url = (window.URL || window.webkitURL).createObjectURL(blob),
                    a = document.createElement("a")
                a.setAttribute("href", url)
                a.setAttribute("download", fileName)
                a.style.display = "none"
                document.body.appendChild(a)
                a.click()
                setTimeout(function () {
                    a.remove()
                    window.URL.revokeObjectURL(url)
                    resolve()
                }, 0)
            }
        } catch(ex) {
            reject(ex)
        }
    })
}
...