将 Blob URL 转换为普通 URL [英] Convert blob URL to normal URL

问题描述

我的页面生成这样的 URL:"blob:http%3A//localhost%3A8383/568233a1-8b13-48b3-84d5-cca045ae384f" 如何将其转换为普通地址?

My page generates a URL like this: "blob:http%3A//localhost%3A8383/568233a1-8b13-48b3-84d5-cca045ae384f" How can I convert it to a normal address?

我将它用作 的 src 属性.

I'm using it as an <img>'s src attribute.

推荐答案

从 JavaScript Blob 创建的 URL 无法转换为普通"URL.

A URL that was created from a JavaScript Blob can not be converted to a "normal" URL.

A blob: URL 不是指服务器上存在的数据，而是指当前页面的浏览器当前内存中的数据.它在其他页面上将不可用，在其他浏览器中将不可用，在其他计算机上将不可用.

A blob: URL does not refer to data the exists on the server, it refers to data that your browser currently has in memory, for the current page. It will not be available on other pages, it will not be available in other browsers, and it will not be available from other computers.

因此，通常将 Blob URL 转换为普通"URL 是没有意义的.如果你想要一个普通的 URL，你必须将数据从浏览器发送到服务器，然后让服务器像普通文件一样提供它.

Therefore it does not make sense, in general, to convert a Blob URL to a "normal" URL. If you wanted an ordinary URL, you would have to send the data from the browser to a server and have the server make it available like an ordinary file.

至少在 Chrome 中，可以将 blob: URL 转换为 data: URL.您可以使用 AJAX 请求从 blob: URL 中获取"数据(即使它实际上只是将其从浏览器的内存中拉出，而不是发出 HTTP 请求).

It is possible convert a blob: URL into a data: URL, at least in Chrome. You can use an AJAX request to "fetch" the data from the blob: URL (even though it's really just pulling it out of your browser's memory, not making an HTTP request).

这是一个例子:

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

data: URL 可能不是您所说的正常"，并且可能会出现问题.然而，它们确实像普通 URL 一样工作，因为它们可以共享；它们并非特定于当前浏览器或会话.

data: URLs are probably not what you mean by "normal" and can be problematically large. However they do work like normal URLs in that they can be shared; they're not specific to the current browser or session.

这篇关于将 Blob URL 转换为普通 URL的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！