Converter URL de blob em URL normal

Minha página gera um URL como este: "blob:http%3A//localhost%3A8383/568233a1-8b13-48b3-84d5-cca045ae384f" Como posso convertê-lo em um endereço normal?

Eu estou usando isso como um atributo src .

Um URL criado a partir de um Blob JavaScript não pode ser convertido em um URL “normal”.

Um blob: URL não se refere aos dados que existem no servidor, refere-se aos dados que o seu navegador possui atualmente na memory, para a página atual. Ele não estará disponível em outras páginas, não estará disponível em outros navegadores e não estará disponível em outros computadores.

Portanto, não faz sentido, em geral, converter uma URL Blob uma URL “normal”. Se você quisesse uma URL comum, teria que enviar os dados do navegador para um servidor e fazer com que o servidor os disponibilizasse como um arquivo comum.

É possível converter um blob: URL em um URL de data: , pelo menos no Chrome. Você pode usar um pedido AJAX para “buscar” os dados do blob: URL (mesmo que ele esteja apenas puxando-o para fora da memory do seu navegador, não fazendo uma solicitação HTTP).

Aqui está um exemplo:

 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(); 

Outra maneira de criar um URL de dados a partir do URL do blob pode estar usando a canvas.

 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) 

como o que vi no mdn, o canvas.toDataURL é bem suportado pelos navegadores. (exceto ie <9, sempre ie <9)

Como a resposta anterior disse, não há maneira de decodificá-lo de volta para o URL, mesmo quando você tenta vê-lo no painel cromo devtools, o URL ainda pode estar codificado como blob.

No entanto, é possível obter os dados, outra maneira de obter os dados é colocá-los em uma âncora e baixá-los diretamente.

 download 

Insira isso na página que contém o URL blob e clique no botão para obter o conteúdo.

Outra maneira é interceptar a chamada do ajax através de um servidor proxy, então você pode ver a URL da imagem verdadeira.