Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Объект Blob представляет из себя объект наподобие файла с неизменяемыми, необработанными данными. Blob-ы представляют данные, которые могут быть не в родном формате JavaScript. Интерфейс File основан на Blob, наследует функциональность Blob и расширяет его для поддержки файлов на стороне пользователя.

Для создания Blob не из blob-ных объектов и данных, используйте конструктор Blob() . Для того чтобы создать blob из подмножества данных из другого blob-а, используйте метод slice(). Для того чтобы получить объект Blob для файла на пользовательской файловой системе, смотрите докуметацию File.

API принимающие Blob объекты также перечислены в документации File.

Заметка: Метод slice() имеет изначально задаваемую длину как второй аргумент, что используется для указания числа байт копируемых в новый Blob. Если указать такие параметры start + length, которые превышают размер исходного Blob, то возвращаемый Blob будет содержать данные от начального индекса (start index) до конца исходного Blob.

Заметка:  Следует помнить ,что метод slice() имеет сторонние префиксы в некоторых браузерах: blob.mozSlice() для Firefox 12 и ранее,  так же blob.webkitSlice() в Safari. Старая версия метода slice(), без сторонних приставок, имеет другой алгоритм и устарела. Поддержка blob.mozSlice() была убрана в Firefox 30.

Конструктор

Blob(blobParts[, options])
Возвращает только что созданный Blob объект, содержимое которого состоит из конкатенации массива значений, переданного через параметр.

Свойства

Blob.isClosed Только для чтения
Логическое значение, показывающее, вызывался ли метод Blob.close() у blob. Закрытый blob не может быть прочитан.
Blob.size Только для чтения
Размер данных, содержащихся в Blob-объекте, в байтах.
Blob.type Только для чтения
Строка с MIME-типом данных, содержащихся в Blob-е. Если тип неизвестен, строка пуста.

Методы

Blob.close()
Закрывает Blob объект, по возможности освобождая занятые им ресурсы.
Blob.slice([start[, end[, contentType]]])
Возвращает новый Blob объект, содержащий данные в указанном диапазоне байтов исходного Blob.

Примеры

Пример использования конструктора Blob

Blob() constructor позволяет создавать blob-ы из других объектов. Например, чтобы сконструировать blob из строки:

var debug = {hello: "world"};
var blob = new Blob([JSON.stringify(debug, null, 2)], {type : 'application/json'});

До того как конструктор Blob стал доступен, это могло быть выполнено через устаревший API BlobBuilder:

var builder = new BlobBuilder();
var fileParts = ['<a id="a"><b id="b">hey!</b></a>'];
builder.append(fileParts[0]);
var myBlob = builder.getBlob('text/xml');

Пример для создания URL для типизированного массива используя blob

Следующий код:

var typedArray = GetTheTypedArraySomehow();
var blob = new Blob([typedArray], {type: 'application/octet-binary'}); // pass a useful mime type here
var url = URL.createObjectURL(blob);
// url will be something like: blob:d3958f5c-0777-0845-9dcf-2cb28783acaf
// now you can use the url in any context that regular URLs can be used in, for example img.src, etc.

Пример извлечения данных из Blob

Есть только один способ прочесть содержимое из Blob-а - это использовать FileReader. Следующий код читает содержимое Blob-а как типизированный массив.

var reader = new FileReader();
reader.addEventListener("loadend", function() {
   // reader.result contains the contents of blob as a typed array
});
reader.readAsArrayBuffer(blob);

Используя другие методы FileReader, возможно прочесть содержимое blob-а как строку или как data URL.

Спецификации

Specification Status Comment
File API
Определение 'Blob' в этой спецификации.
Рабочий черновик Initial definition

Браузерная совместимость

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
BlobChrome Полная поддержка 5Edge Полная поддержка ДаFirefox Полная поддержка 4IE Полная поддержка 10Opera Полная поддержка 11Safari Полная поддержка 5.1WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка 14Opera Android Полная поддержка ДаSafari iOS Полная поддержка ДаSamsung Internet Android Полная поддержка Да
Blob() constructor
Экспериментальная
Chrome Полная поддержка 20Edge ? Firefox Полная поддержка 13
Замечания
Полная поддержка 13
Замечания
Замечания Before Firefox 16, the second parameter, when set to null or undefined, leads to an error instead of being handled as an empty dictionary.
IE Полная поддержка 10Opera Полная поддержка 12Safari Полная поддержка 8WebView Android Полная поддержка 37Chrome Android Полная поддержка 25Firefox Android Полная поддержка 14
Замечания
Полная поддержка 14
Замечания
Замечания Before Firefox 16, the second parameter, when set to null or undefined, leads to an error instead of being handled as an empty dictionary.
Opera Android ? Safari iOS ? Samsung Internet Android ?
sizeChrome Полная поддержка 5Edge Полная поддержка 12Firefox Полная поддержка 4IE Полная поддержка 10Opera Полная поддержка 11Safari Полная поддержка 5.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетFirefox Android Нет поддержки НетOpera Android Нет поддержки НетSafari iOS Нет поддержки НетSamsung Internet Android Нет поддержки Нет
typeChrome Полная поддержка 5Edge Полная поддержка 12Firefox Полная поддержка 4IE Полная поддержка 10Opera Полная поддержка 11Safari Полная поддержка 5.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетFirefox Android Нет поддержки НетOpera Android Нет поддержки НетSafari iOS Нет поддержки НетSamsung Internet Android Нет поддержки Нет
sliceChrome Полная поддержка 21
Полная поддержка 21
Нет поддержки 5 — 25
С префиксом
С префиксом Требует вендорный префикс: webkit
Edge Полная поддержка 12Firefox Полная поддержка 13
Замечания
Полная поддержка 13
Замечания
Замечания Prior to Gecko 12.0 (Firefox 12.0 / Thunderbird 12.0 / SeaMonkey 2.9), there was a bug that affected the behavior of Blob.slice(); it did not work for start and end positions outside the range of signed 64-bit values; it has now been fixed to support unsigned 64-bit values.
Нет поддержки 5 — 13
С префиксом
С префиксом Требует вендорный префикс: moz
IE Полная поддержка 10Opera Полная поддержка 12Safari Полная поддержка 5.1
С префиксом
Полная поддержка 5.1
С префиксом
С префиксом Требует вендорный префикс: webkit
WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка 14Opera Android Полная поддержка ДаSafari iOS Полная поддержка ДаSamsung Internet Android Полная поддержка Да

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки
Совместимость неизвестна  
Совместимость неизвестна
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Смотрите замечания реализации.
Смотрите замечания реализации.
Требует вендорный префикс или другое имя для использования.
Требует вендорный префикс или другое имя для использования.

Замечания Gecko: доступность в привилегированном коде

Для использования в коде chrome, JSM и Bootstrap scope, вы должны импортировать его следующим образом:

Cu.importGlobalProperties(['Blob']);

Blob доступен в Worker scopes.

Смотри также

Метки документа и участники

Внесли вклад в эту страницу: YozhEzhi, mdnwebdocs-bot, Miroshy, B0ER, bagau, Bargamut, hunty, eugenezabolotny, BitChap, lexx182a, saga111a, MuradAz
Обновлялась последний раз: YozhEzhi,