Преобразование URL-адреса blob в обычный URL-адрес

Ответ 1

URL, который был создан с помощью JavaScript Blob, не может быть преобразован в "обычный" URL.

A blob: URL-адрес не относится к данным, существующим на сервере, это относится к данным, которые ваш браузер имеет в настоящее время в памяти, для текущей страницы. Он не будет доступен на других страницах, он не будет доступен в других браузерах, и он не будет доступен с других компьютеров.

Поэтому нет смысла, в общем, преобразовывать URL Blob в "обычный" URL. Если вам нужен обычный URL-адрес, вам придется отправить данные из браузера на сервер и сделать его доступным, как обычный файл.

Возможно преобразование URL blob: в URL data:, по крайней мере, в Chrome. Вы можете использовать запрос AJAX для "извлечения" данных с URL-адреса blob: (хотя он действительно просто вытаскивает его из памяти вашего браузера, не делая HTTP-запрос).

Вот пример:

var blob = new Blob(["Hello, world!"], { type: 'text/plain' });
var blobUrl = URL.createObjectURL(blob);

var xhr = new XMLHttpRequest;
xhr.responseType = 'blob';

xhr.onload = function() {
   var recoveredBlob = xhr.response;

   var reader = new FileReader;

   reader.onload = function() {
     var blobAsDataUrl = reader.result;
     window.location = blobAsDataUrl;
   };

   reader.readAsDataURL(recoveredBlob);
};

xhr.open('GET', blobUrl);
xhr.send();

Ответ 2

Другой способ создать URL-адрес данных из URL-адреса blob может использовать холст.

var canvas = document.createElement("canvas")
var context = canvas.getContext("2d")
context.drawImage(img, 0, 0) // i assume that img.src is your blob url
var dataurl = canvas.toDataURL("your prefer type", your prefer quality)

как то, что я видел в mdn, canvas.toDataURL хорошо поддерживается браузерами. (за исключением, например, < 9, всегда то есть < 9)

Ответ 3

Для тех, кто пришел сюда в поисках способа загрузки видео/аудио с URL-адресом блоба, этот ответ мне помог. Короче говоря, вам нужно найти файл *.m3u8 на нужной веб-странице через Chrome → вкладка "Сеть" и вставить его в проигрыватель VLC.

Другое руководство показывает, как сохранить поток с помощью VLC Player.

Ответ 4

Как говорилось в предыдущем ответе, невозможно декодировать его обратно в URL-адрес, даже если вы попытаетесь увидеть его на панели Chrome Devtools, URL-адрес все еще может быть закодирован как BLOB-объект.

Тем не менее, есть возможность получить данные, еще один способ получить данные - поместить их в якорь и напрямую загрузить.

<a href="blob:http://example.com/xxxx-xxxx-xxxx-xxxx" download>download</a>

Вставьте это на страницу, содержащую URL-адрес BLOB-объекта и нажмите кнопку, вы получите содержимое.

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