From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/ru/web/api/blob/blob/index.html | 123 +++++++++++++++++++++++ files/ru/web/api/blob/index.html | 178 +++++++++++++++++++++++++++++++++ files/ru/web/api/blob/slice/index.html | 59 +++++++++++ 3 files changed, 360 insertions(+) create mode 100644 files/ru/web/api/blob/blob/index.html create mode 100644 files/ru/web/api/blob/index.html create mode 100644 files/ru/web/api/blob/slice/index.html (limited to 'files/ru/web/api/blob') diff --git a/files/ru/web/api/blob/blob/index.html b/files/ru/web/api/blob/blob/index.html new file mode 100644 index 0000000000..b1ed2d7bc1 --- /dev/null +++ b/files/ru/web/api/blob/blob/index.html @@ -0,0 +1,123 @@ +--- +title: Blob() +slug: Web/API/Blob/Blob +translation_of: Web/API/Blob/Blob +--- +

{{APIRef("File API")}}

+ +

Конструктор Blob() возвращает новый объект {{domxref("Blob")}}. Содержимое blob состоит из объединенных значений, переданных в параметре array.

+ +

Синтаксис

+ +
var aBlob = new Blob( array, options );
+
+ +

Параметры

+ + + +

Пример

+ +
var aFileParts = ['<a id="a"><b id="b">hey!</b></a>']; // an array consisting of a single DOMString
+var oMyBlob = new Blob(aFileParts, {type : 'text/html'}); // the blob
+ +

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

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('File API', '#constructorBlob', 'Blob()')}}{{Spec2('File API')}}Initial definition.
+ +

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

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support20{{CompatGeckoDesktop("13.0")}} [1]1012.108
in Workers{{CompatUnknown}}{{CompatGeckoDesktop("14.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatGeckoMobile("13.0")}} [1]{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}
in Workers{{CompatUnknown}}{{CompatGeckoMobile("14.0")}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

[1] Before Firefox 16, the second parameter, when set to null or undefined, leads to an error instead of being handled as an empty dictionary.

+ +

See also

+ + + +

 

diff --git a/files/ru/web/api/blob/index.html b/files/ru/web/api/blob/index.html new file mode 100644 index 0000000000..a256ce6a5f --- /dev/null +++ b/files/ru/web/api/blob/index.html @@ -0,0 +1,178 @@ +--- +title: Blob +slug: Web/API/Blob +translation_of: Web/API/Blob +--- +
{{APIRef("File API")}}
+ +

Объект Blob представляет из себя подобный файлу объект с неизменяемыми, необработанными данными; они могут читаться как текст или двоичные данные, либо могут быть преобразованы в {{DOMxRef("ReadableStream")}}, таким образом, его методы могут быть использованы для обработки данных.

+ +

Blob-ы могут представлять данные, которые не обязательно должны быть в родном для JavaScript формате. Интерфейс {{domxref("File")}} основан на Blob, наследует функциональность Blob и расширяет его для поддержки файлов на стороне пользователя.

+ +

Использование Blob

+ +

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

+ +

API, принимающие объекты Blob, также перечислены в документации на {{domxref("File")}}.

+ +
+

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

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

Конструктор

+ +
+
{{domxref("Blob.Blob", "Blob(blobParts[, options])")}}
+
Возвращает создаваемый объект Blob, который содержит соединение всех данных в массиве, переданном в конструктор.
+
+ +

Свойства

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

Методы

+ +
+
{{domxref("Blob.close()")}} {{experimental_inline}}
+
Закрывает Blob объект, по возможности освобождая занятые им ресурсы.
+
{{domxref("Blob.slice()", "Blob.slice([start[, end[, contentType]]])")}}
+
Возвращает новый Blob объект, содержащий данные в указанном диапазоне байтов исходного Blob.
+
{{DOMxRef("Blob.stream()")}}
+
Возвращает {{DOMxRef("ReadableStream")}}, который может использоваться для чтения содержимого Blob.
+
{{DOMxRef("Blob.text()")}}
+
Возвращает promise, который исполняется с {{DOMxRef("USVString")}}, содержащей всё содержимое Blob, интерпретируемое как текст UTF-8.
+
+ +

Примеры

+ +

Создание Blob

+ +

Конструктор {{domxref("Blob.Blob", "Blob() constructor")}} может создавать объекты blob из других объектов. Например, чтобы сконструировать blob из строки JSON:

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

До того как конструктор Blob стал доступен, это могло быть выполнено через устаревший API {{domxref("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 для содержимого типизированного массива

+ +

Следующий код создает типизированный массив JavaScript и создает новый Blob, содержащий данные типизированного массива. Затем вызывается {{DOMxRef("URL.createObjectURL()")}} для преобразования blob в {{glossary("URL")}}.

+ +

HTML

+ +
<p>This example creates a typed array containing the ASCII codes
+   for the space character through the letter Z, then converts it
+   to an object URL. A link to open that object URL is created.
+   Click the link to see the decoded object URL.</p>
+ +

JavaScript

+ +

Основной частью этого кода для примера является функция typedArrayToURL(), которая создает Blob из переданного типизированного массива и возвращает объект URL для него. Преобразовав данные в URL объекта, их можно использовать несколькими способами, в том числе, в качестве значения атрибута {{htmlattrxref("src", "img")}} элементов {{HTMLElement("img")}} (конечно, при условии, что данные содержат изображение).

+ +
function typedArrayToURL(typedArray, mimeType) {
+  return URL.createObjectURL(new Blob([typedArray.buffer], {type: mimeType}))
+}
+
+const bytes = new Uint8Array(59);
+
+for(let i = 0; i < 59; i++) {
+  bytes[i] = 32 + i;
+}
+
+const url = typedArrayToURL(bytes, 'text/plain');
+
+const link = document.createElement('a');
+link.href = url;
+link.innerText = 'Open the array URL';
+
+document.body.appendChild(link);
+ +

+

Другой пример

+ + +
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 – это использовать {{domxref("FileReader")}}. Следующий код читает содержимое Blob как типизированный массив.

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

Другой способ прочитать содержимое из Blob – это использовать {{domxref("Response")}}. Следующий код читает содержимое Blob как текст:

+ +
const text = await (new Response(blob)).text();
+
+ +

Или можно использовать {{DOMxRef("Blob.text()")}}:

+ +
const text = await blob.text();
+ +

Используя другие методы {{domxref("FileReader")}}, возможно прочесть содержимое объекта Blob как строку или как URL.

+ +

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

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('File API','#blob-section','Blob')}}{{Spec2('File API')}}Initial definition
+ +

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

+ +

{{Compat("api.Blob")}}

+ +

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

+ +

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

+ +
Cu.importGlobalProperties(['Blob']);
+
+ +

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

+ +

Смотри также

+ + diff --git a/files/ru/web/api/blob/slice/index.html b/files/ru/web/api/blob/slice/index.html new file mode 100644 index 0000000000..f0e5eaf4df --- /dev/null +++ b/files/ru/web/api/blob/slice/index.html @@ -0,0 +1,59 @@ +--- +title: Blob.slice() +slug: Web/API/Blob/slice +translation_of: Web/API/Blob/slice +--- +
{{APIRef("File API")}}
+ +

Метод Blob.slice() используется для создания нового объекта  {{domxref("Blob")}}, содержащего данные в указанном диапазоне байтов исходника {{domxref("Blob")}}.

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

Синтаксис

+ +
var blob = instanceOfBlob.slice([start [, end [, contentType]]]);
+ +

Параметры

+ +
+
start {{optional_inline}}
+
Индекс в {{domxref("Blob")}} указывающий первый байт, включенный в новый {{domxref("Blob")}}. Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно 0. Если указать значение start, которое больше размера источника {{domxref("Blob")}}, размер возвращаемого {{domxref("Blob")}} будет равен 0 и не будет содержать данных.
+
end {{optional_inline}}
+
Индекс в {{domxref("Blob")}} указывающий первый байт, который не будет включен в новый {{domxref("Blob")}} (т.е. байт с этим индексом не будет включен). Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно size.
+
contentType {{optional_inline}}
+
Тип содержимого нового {{domxref("Blob")}}; это будет значение его свойства type. Значение по умолчанию - пустая строка.
+
+ +

Возвращаемое значение

+ +

Новый {{domxref("Blob")}} объект содержит данные, указанные в источнике {{domxref("Blob")}}.

+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName("File API", "#dfn-slice", "Blob.slice()")}}{{Spec2("File API")}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("api.Blob.slice")}}

+ +

See also

+ + -- cgit v1.2.3-54-g00ecf