什么是blob URL以及为什么使用它？ [英] What is a blob URL and why it is used?

问题描述

我对blob网址存在很大问题。

我正在搜索视频标记的 src YouTube和我发现视频 src 类似于：

  src = blob：https：//crap.crap
  

我打开了<$中的blob网址c $ c> src 视频出错，我无法打开，但正在使用 src 标记。这怎么可能？

要求：

• 什么是blob网址？


• 为何使用它？


• 我可以在服务器上创建自己的blob URL吗？


• 如果你有任何其他细节

提前致谢

解决方案

Blob URL（参考 W3C ，官方名称）或Object-URLs（ref 。 MDN 和方法名称）与 Blob 或文件对象。

src =blob： https：//crap.crap 我打开了$ src中的blob网址b $ b视频它给出了一个错误di无法打开，但正在使用src
标签如何实现？

Blob网址只能生成在浏览器内部。 URL.createObjectURL（） 将创建对Blob或File对象的特殊引用，稍后可以使用 URL.revokeObjectURL（） 。这些URL只能在浏览器的单个实例中本地使用，并且在同一个会话中（即页面/文档的生命周期）。

什么是blob网址？

为什么使用它？

Blob网址/对象网址是一个伪协议允许Blob和File对象用作图像，下载二进制数据链接等的URL源。

例如，你不能手一个Image对象原始字节数据，因为它不知道如何处理它。它需要例如通过URL加载图像（二进制数据）。这适用于需要URL作为源的任何内容。而不是上传二进制数据，然后通过URL提供服务，最好使用额外的本地步骤，以便能够直接访问数据而无需通过服务器。

<它也是Data-URI的更好替代品，Data-URI是编码为 Base-64 的字符串。 Data-URI的问题是每个char在JavaScript中占用两个字节。最重要的是，由于Base-64编码，添加了33％。 Blob是纯二进制字节数组，它没有像Data-URI那样有任何显着的开销，这使得它们更快更小，可以处理。

我可以在服务器上创建自己的blob网址吗？

不能，Blob网址/对象网址只能在浏览器内部制作。您可以通过File Reader API创建Blob并获取File对象，尽管BLOB只是意味着Binary Large OBject并存储为字节数组。客户端可以请求将数据作为ArrayBuffer或Blob发送。服务器应将数据作为纯二进制数据发送。数据库通常也使用Blob来描述二进制对象，实质上我们基本上都在讨论字节数组。

如果你有的话详细信息

您需要将二进制数据封装为BLOB对象，然后使用 URL.createObjectURL（）为其生成本地URL：

  var blob = new Blob（[arrayBufferWithPNG]，{type ：image / png}），
 url = URL.createObjectURL（blob），
 img = new Image（）; 
 
 img.onload = function（）{
 URL.revokeObjectURL（this.src）; //清理内存
 document.body.appendChild（this）; //将图像添加到DOM 
} 
 
 img.src = url; //现在可以流字节
  

请注意 URL 可以在webkit浏览器中加上前缀，因此请使用：

  var url =（URL || webkitURL）.createObjectURL （...）; 
  

I am having very much problem with blob URL.

I was searching for src of video tag on YouTube and I found that the video src was like:

src="blob:https://crap.crap"

I opened the blob URL that was in src of video it gave a error and I can't open but was working with the src tag. How is this possible?

Requirements:

• What is blob URL?
• Why it is used?
• Can I make my own blob URL on a server?
• If you have any additional details

Thanks in advance

解决方案

Blob URLs (ref W3C, official name) or Object-URLs (ref. MDN and method name) are used with a Blob or a File object.

src="blob:https://crap.crap" I opened the blob url that was in src of video it gave a error and i can't open but was working with the src tag how it is possible?

Blob URLs can only be generated internally by the browser. URL.createObjectURL() will create a special reference to the Blob or File object which later can be released using URL.revokeObjectURL(). These URLs can only be used locally in the single instance of the browser and in the same session (ie. the life of the page/document).

What is blob url?
Why it is used?

Blob URL/Object URL is a pseudo protocol to allow Blob and File objects to be used as URL source for things like images, download links for binary data and so forth.

For example, you can not hand an Image object raw byte-data as it would not know what to do with it. It requires for example images (which are binary data) to be loaded via URLs. This applies to anything that require an URL as source. Instead of uploading the binary data, then serve it back via an URL it is better to use an extra local step to be able to access the data directly without going via a server.

It is also a better alternative to Data-URI which are strings encoded as Base-64. The problem with Data-URI is that each char takes two bytes in JavaScript. On top of that a 33% is added due to the Base-64 encoding. Blobs are pure binary byte-arrays which does not have any significant overhead as Data-URI does, which makes them faster and smaller to handle.

Can i make my own blob url on a server?

No, Blob URLs/Object URLs can only be made internally in the browser. You can make Blobs and get File object via the File Reader API, although BLOB just means Binary Large OBject and is stored as byte-arrays. A client can request the data to be sent as either ArrayBuffer or as a Blob. The server should send the data as pure binary data. Databases often uses Blob to describe binary objects as well, and in essence we are talking basically about byte-arrays.

if you have then Additional detail

You need to encapsulate the binary data as a BLOB object, then use URL.createObjectURL() to generate a local URL for it:

var blob = new Blob([arrayBufferWithPNG], {type: "image/png"}),
    url = URL.createObjectURL(blob),
    img = new Image();

img.onload = function() {
    URL.revokeObjectURL(this.src);     // clean-up memory
    document.body.appendChild(this);   // add image to DOM
}

img.src = url;                         // can now "stream" the bytes

Note that URL may be prefixed in webkit-browsers, so use:

var url = (URL || webkitURL).createObjectURL(...);

这篇关于什么是blob URL以及为什么使用它？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！