aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
commit074785cea106179cb3305637055ab0a009ca74f2 (patch)
treee6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data
parentda78a9e329e272dedb2400b79a3bdeebff387d47 (diff)
downloadtranslated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz
translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2
translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip
initial commit
Diffstat (limited to 'files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data')
-rw-r--r--files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html171
1 files changed, 171 insertions, 0 deletions
diff --git a/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html b/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html
new file mode 100644
index 0000000000..9cc9ae0a35
--- /dev/null
+++ b/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html
@@ -0,0 +1,171 @@
+---
+title: Отправка и получение бинарных данных
+slug: Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data
+translation_of: Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data
+---
+<h2 id="Receiving_binary_data_using_JavaScript_typed_arrays" name="Receiving_binary_data_using_JavaScript_typed_arrays">Получение бинарных данных используя JavaScript arrays </h2>
+
+<p>Свойство responseType объекта XMLHttpRequest можно задать для изменения ожидаемого типа ответа с сервера. Возможные значения: пустая строка (по умолчанию), "arraybuffer", "blob", "document", "json" и "text". Свойство response будет содержать тело сущности в соответствии с типом ответа, как ArrayBuffer, Blob, Document, JSON или string. Это значение равно null, если запрос не завершен или не был успешным.</p>
+
+<p>В этом примере изображение считывается как двоичный файл и создается 8-разрядный массив целых чисел без знака из необработанных байтов. Обратите внимание, что это не будет декодировать изображение и читать пиксели. Для этого вам понадобится <a href="https://github.com/devongovett/png.js/">библиотека декодирования png</a>.</p>
+
+<pre class="brush: js notranslate">var oReq = new XMLHttpRequest();
+oReq.open("GET", "/myfile.png", true);
+oReq.responseType = "arraybuffer";
+
+oReq.onload = function (oEvent) {
+ var arrayBuffer = oReq.response; // Note: not oReq.responseText
+ if (arrayBuffer) {
+ var byteArray = new Uint8Array(arrayBuffer);
+ for (var i = 0; i &lt; byteArray.byteLength; i++) {
+ // do something with each byte in the array
+ }
+ }
+};
+
+oReq.send(null);
+</pre>
+
+<p>Альтернатива вышеуказанному методу использует интерфейс {{domxref("Blob")}} для непосредственного построения Blob с данными arraybuffer.</p>
+
+<pre class="brush: js notranslate">var oReq = new XMLHttpRequest();
+oReq.open("GET", "/myfile.png", true);
+oReq.responseType = "arraybuffer";
+
+oReq.onload = function(oEvent) {
+ var blob = new Blob([oReq.response], {type: "image/png"});
+ // ...
+};
+
+oReq.send();
+</pre>
+
+<p>Также вы можете прочитать двоичный файл как {{domxref ("Blob")}}, установив строку" blob " в свойство responseType.</p>
+
+<pre class="brush: js notranslate">var oReq = new XMLHttpRequest();
+oReq.open("GET", "/myfile.png", true);
+oReq.responseType = "blob";
+
+oReq.onload = function(oEvent) {
+ var blob = oReq.response;
+ // ...
+};
+
+oReq.send();</pre>
+
+<h2 id="Receiving_binary_data_in_older_browsers" name="Receiving_binary_data_in_older_browsers">Получение бинарных данных в старых браузерах</h2>
+
+<p>Функция load_binary_resource(), показанная ниже, загружает двоичные данные из указанного URL, возвращая их вызывающему объекту.</p>
+
+<pre class="brush: js notranslate">function load_binary_resource(url) {
+ var req = new XMLHttpRequest();
+ req.open('GET', url, false);
+ //XHR binary charset opt by Marcus Granado 2006 [http://mgran.blogspot.com]
+ req.overrideMimeType('text\/plain; charset=x-user-defined');
+ req.send(null);
+ if (req.status != 200) return '';
+ return req.responseText;
+}
+</pre>
+
+<p>Магия происходит в строке 5, которая переопределяет тип MIME, заставляя браузер рассматривать его как обычный текст, используя пользовательский набор символов. Это говорит браузеру не анализировать его и пропускать байты через необработанные.</p>
+
+<pre class="brush: js notranslate">var filestream = load_binary_resource(url);
+var abyte = filestream.charCodeAt(x) &amp; 0xff; // throw away high-order byte (f7)
+</pre>
+
+<p>The example above fetches the byte at offset <code>x</code> within the loaded binary data. The valid range for <code>x</code> is from 0 to <code>filestream.length-1</code>.</p>
+
+<p>See <a href="http://web.archive.org/web/20071103070418/http://mgran.blogspot.com/2006/08/downloading-binary-streams-with.html">downloading binary streams with XMLHttpRequest</a> for a detailed explanation. See also <a href="/en-US/docs/Code_snippets/Downloading_Files" title="Code_snippets/Downloading_Files">downloading files</a>.</p>
+
+<h2 id="Получение_бинарных_данных_из_различных_источников">Получение бинарных данных из различных источников</h2>
+
+<p>Библиотека <a href="https://github.com/jDataView/jBinary">jBinary</a> для работы с бинарными данными в JavaScript позволяет загрузить данные из любого источника, автоматически определяя лучший способ для этого в текущем броузере или Node.js:</p>
+
+<pre class="brush: js notranslate">jBinary.load(url).then(function (binary) {
+ // здесь аргумент `binary` может использовться для обработки данных
+ // в любом формате (строка, массив байтов, структура данных и т. д.)
+});
+</pre>
+
+<h2 id="Sending_binary_data" name="Sending_binary_data">Отправка бинарных данных</h2>
+
+<p>Метод <code>send</code> объекта XMLHttpRequest был расширен, чтобы обеспечить легкую передачу бинарных данных - теперь он принимает объекты <a href="/en-US/docs/JavaScript_typed_arrays/ArrayBuffer" title="ArrayBuffer"><code>ArrayBuffer</code></a>, {{domxref("Blob")}}, или {{domxref("File")}}.</p>
+
+<p>В примере ниже на лету создается текстовый файл и отпрвляется методом <code>POST</code> на сервер. Здесь используется обычный текст, но нетрудно представить себе пример с бинарным файлом.</p>
+
+<pre class="brush: js notranslate">var oReq = new XMLHttpRequest();
+oReq.open("POST", url, true);
+oReq.onload = function (oEvent) {
+ // Uploaded.
+};
+
+var blob = new Blob(['abc123'], {type: 'text/plain'});
+
+oReq.send(blob);
+</pre>
+
+<h2 id="Sending_typed_arrays_as_binary_data" name="Sending_typed_arrays_as_binary_data">Отправка типизированнх массивов как бинарных данных</h2>
+
+<p>Точно так же можно отправлять типизированные массивы JavaScript.</p>
+
+<pre class="brush: js notranslate">var myArray = new ArrayBuffer(512);
+var longInt8View = new Uint8Array(myArray);
+
+for (var i=0; i&lt; longInt8View.length; i++) {
+ longInt8View[i] = i % 255;
+}
+
+var xhr = new XMLHttpRequest;
+xhr.open("POST", url, false);
+xhr.send(myArray);
+</pre>
+
+<p>Здесь создается и отправляется 512-ти байтовый массив из 8-битных целых чисел, н, разумеется, можно использовать любые двоичные данные.</p>
+
+<div class="note"><strong>Примечание:</strong> Поддержка передачи объектов <a href="/en-US/docs/JavaScript_typed_arrays/ArrayBuffer" title="ArrayBuffer"><code>ArrayBuffer</code></a> с помощью XMLHttpRequest появилась в Gecko 9.0 {{geckoRelease("9.0")}}. <strong>Add information about other browsers' support here.</strong></div>
+
+<h2 id="Submitting_forms_and_uploading_files" name="Submitting_forms_and_uploading_files">Отправка форм и загрузка файлов</h2>
+
+<p>См. <a href="/ru/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files" title="DOM/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files">этот параграф</a>.</p>
+
+<h2 id="Firefox-specific_examples" name="Firefox-specific_examples">Примеры для Firefox</h2>
+
+<p>В этом примере двоичные данные передаются асинхронно методом <code>POST</code> и нестандартным методом Firefox's <code>sendAsBinary()</code>.</p>
+
+<pre class="brush: js notranslate">var req = new XMLHttpRequest();
+req.open("POST", url, true);
+// установите заголовок и тип данных
+req.setRequestHeader("Content-Length", 741);
+req.sendAsBinary(aBody);
+</pre>
+
+<p>В строке 4 заголовок Content-Length устанавливается в 741, что означает, что размер данных 741 байт. Разумеется, это значение должно соотвествовать реальному размеру данных.</p>
+
+<p>В строке 5 метод <code>sendAsBinary()</code> начинает запрос.</p>
+
+<div class="note"><strong>Примечание:</strong> Нестандартный метод <code>sendAsBinary</code> начиная с Gecko 31 {{ geckoRelease(31) }} считается устаревшим и скоро будет удален. Вместо него, как показывалось выше, можно использовать стандартный метод <code>send(Blob data)</code>.</div>
+
+<p>Кроме того, чтобы отправить бинарные данные можно передать экземплят {{interface("nsIFileInputStream")}} в метод <a href="/en-US/docs/DOM/XMLHttpRequest#send()" title="XMLHttpRequest#send()"><code>send()</code></a>. В этом случае заголовок <code>Content-Length</code> заполнять явно необязательно, поскольку информация получается из потока автоматически:</p>
+
+<pre class="brush: js notranslate">// Создание потока из файла.
+var stream = Components.classes["@mozilla.org/network/file-input-stream;1"]
+ .createInstance(Components.interfaces.nsIFileInputStream);
+stream.init(file, 0x04 | 0x08, 0644, 0x04); // file is an nsIFile instance
+
+// Попытка опредедения типа MIME для файла
+var mimeType = "text\/plain";
+try {
+ var mimeService = Components.classes["@mozilla.org/mime;1"]
+ .getService(Components.interfaces.nsIMIMEService);
+ mimeType = mimeService.getTypeFromFile(file); // file is an nsIFile instance
+}
+catch (oEvent) { /* в случае ошибки просто использовать text/plain */ }
+
+// Отправка
+var req = Components.classes["@mozilla.org/xmlextras/xmlhttprequest;1"]
+ .createInstance(Components.interfaces.nsIXMLHttpRequest);
+req.open('PUT', url, false); /* синхронный вызов! */
+req.setRequestHeader('Content-Type', mimeType);
+req.send(stream);
+</pre>