Передать файл на сервер, в виде строки двоичных данных

@Mr_Progger · Регистрация: 01.11.2013

Студворк — интернет-сервис помощи студентам

Доброго времени суток. Возможно ли по средствам javascript передать файл на сервер? Думается нужно получить двоичное представление файла и как строку отправить на сервер, как это можно реализовать?

@alexsamos33 · 24.05.2015, 17:03

1) http://habrahabr.ru/post/120917/
2) http://xdan.ru/Working-with-fi... asics.html

@Mr_Progger · 26.05.2015, 21:35 **[ТС]**

Получается отправить только текстовый файл (из мазилы) и то сам текст в файле, а не его двоичное представление.
Делаю так

HTML5
1
<input type="file" onChange="readfile(this.files);"></input>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
<script>
function readfile(files)
{
  var formData = new FormData();
  formData.append(files[0].name, files[0]);
  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/input_file', true);
  xhr.onload = function(e) {};
  xhr.send(formData);
}
</script>

Если цепляю не текстовый файл, а например jpeg то на сервер
приходит такой запрос

Кликните здесь для просмотра всего текста

Подскажите как всё таки представить любой файл в виде бинарной строки?

@alexsamos33 · 26.05.2015, 23:07

Что-то я не понял что у вас приходит на сервер.
У меня всё работает нормально, всё приходит как надо, может дело в браузере? (У меня Firefox 38.0.1)...

Попробуйте этот рабочий код:
Форма:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<input type="file" onChange="readfile(this.files);">
<script>
function readfile(files)
{
  var formData = new FormData();
  formData.append("filename", files[0].name);
  formData.append("file", files[0]);
  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/input_file.php', true);
  xhr.onload = function(e) {
  alert(xhr.responseText);
};
  xhr.send(formData);
}
</script>

input_file.php

PHP
1
2
3
4
5
6
7
8
9
10
11
12
<?php
echo("FILES dump: ");
var_dump($_FILES);
echo("\r\n");
echo("POST dump: ");
var_dump($_POST);
echo("\r\n");
 
$new_file_path = "./input_" . basename($_FILES["file"]["name"]);
$move_result = move_uploaded_file($_FILES["file"]["tmp_name"], $new_file_path);
echo("move_result dump: ");
var_dump($move_result);

Я у себя запускал, работает.
Что js покажет в alert после выбора и загрузки файла?

P.S. Рядом с php скриптом будет находиться загруженный файл с префиксом input_ , этот файл у меня нормально загружается, не важно, txt / jpg / mp3...

Добавлено через 10 минут

Сообщение от Mr_Progger

Получается отправить только текстовый файл (из мазилы) и то сам текст в файле, а не его двоичное представление.

Сообщение от Mr_Progger

Подскажите как всё таки представить любой файл в виде бинарной строки?

А, ну так это уже надо делать на сервере. Или вот ещё вариант: Работа с файлами в JavaScript, Часть 2: FileReader.

@Mr_Progger · 27.05.2015, 07:21 **[ТС]**

alexsamos33, сервер ПХП не поддерживает. Хранить файл на сервер я предполагал в строковой переменной. На самом деле мне необходимо получить просто двоичное представление файла, а отправлю я это обычным ПОСТ запросом при необходимости разделив этот двоичный текст на части. Получать с сервера эту же двоичную строку и делать обратное преобразование.

Сервер это железка на сигнальном процессоре и файловой системы как таковой там нет, я тупо слушаю 80 порт по протоколу tcp/ip.

@alexsamos33 · 27.05.2015, 07:39

Ну так попробуйте отправить через FileReader, получите dataUri и отправьте эту строку POST запросом...
А если через formData / XMLHttpRequest отправлять, то на сервер придёт обычный POST, как если бы вы отправили настоящую форму с файлом.
На сервер они придут вот в таком виде:

Code
1
2
3
4
5
6
7
8
9
10
11
12
13
POST /outfile HTTP/1.1
Host: example.com
Accept: */*
Referer: http://example.com/form.html
Content-Length: 226959
Content-Type: multipart/form-data; boundary=----------------------------6e786ab9e81f
 
------------------------------6e786ab9e81f
 
Content-Disposition: form-data; name="file"; filename="1.jpg"
 
Content-Type: application/octet-stream
%здесь_код_файла%

А дальше уже из-за вашего сервера зависит, как вы примите и обработаете этот файл, но браузер здесь свою задачу выполняет правильно...

Добавлено через 4 минуты
А, вот же... Наверное то, что вам нужно.
Смотрите здесь заголовок "Чтение в ArrayBuffers"

Вы можете использовать ArrayBuffer в первую очередь при работе с бинарными файлами, чтобы иметь более точный контроль над данными. *Вы можете передать ArrayBuffer непосредственно в метод send () *объекта XHR для передачи исходных данных на сервер (на стороне сервера, данные принимаются и обрабатываются, как двоичные данные ).

@Mr_Progger · 31.05.2015, 16:50 **[ТС]**

Отправку файла сделал так

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
function readfile(file)
{
 
    var textarea = document.getElementById("text_input_file");
    var reader = new FileReader();
    var temp;
    var out_bin = "req_file\n";
    var out_bin2 = "req_file\n";
    reader.readAsArrayBuffer(file);
    reader.onload = function(e) {
    var view = new DataView(reader.result);
    var i = 0, j = 0;
    for (i = 0; i < view.byteLength; i++)
    {
            temp = view.getUint8(i, false);
        if (parseInt(temp, 10).toString(16).length < 2) 
        {
            out_bin += '0' + parseInt(magic, 10).toString(16);
            j++;
        }
        else
        out_bin += parseInt(temp, 10).toString(16);
    }
 
        var f = 9;
    var l = 0;
    for (var j = 0; j < Math.floor((out_bin.length)/4000); j++)
    {
    l = f + 4000;   
    var xhr1 = new XMLHttpRequest();
    xhr1.open('POST', '/input_file', true);
    xhr1.onload = function(e) {};
        textarea.value = out_bin;
        xhr1.send("req_file" + out_bin.slice(f,l));
    f = f + 4000;  
    }   
    var xhr1 = new XMLHttpRequest();
    xhr1.open('POST', '/input_file', true);
    xhr1.onload = function(e) {};
        textarea.value = out_bin;
        xhr1.send("req_file" + out_bin.slice(f, out_bin.length));
};
}
</script>

Как быть с принятием файла от сервера браузеру? Двоичные данный получаю верно. Есть ли механизм сохранения файла на диск по аналогии загрузки файла <input type="file">?

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function req_file()
{
    
    var textarea = document.getElementById("text_input_file"); 
    try {stream4 = new ActiveXObject("Msxml2.XMLHTTP.6.0");}
                          catch (e){}
                          try {stream4 = new ActiveXObject("Microsoft.XMLHTTP");}
                          catch (e){}
                          try {stream4 = new ActiveXObject("Msxml2.XMLHTTP.3.0");}
                          catch (e){}
                          try {stream4 = new XMLHttpRequest();}
                          catch (e){}
                          stream4.open("POST", "/res_file",true);
                          stream4.onreadystatechange = function() {
                          if (stream4.readyState == 4){
                          if (stream4.status == 200){
              if (stream4.responseText.search("res_file")>=0)
                          {
              textarea.value = stream4.responseText;                              
              }}}};
              stream4.send();
   
}

@alexsamos33 · 31.05.2015, 16:53

Попробуй так:

JavaScript
1
stream4.responseBody;

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .

@Mr_Progger 24 / 24 / 16 Регистрация: 01.11.2013 Сообщений: 196

	Передать файл на сервер, в виде строки двоичных данных 24.05.2015, 15:40. Показов 9306. Ответов 7 Метки нет (Все метки) Доброго времени суток. Возможно ли по средствам javascript передать файл на сервер? Думается нужно получить двоичное представление файла и как строку отправить на сервер, как это можно реализовать? 0

@alexsamos33 669 / 640 / 335 Регистрация: 26.04.2014 Сообщений: 2,122
	24.05.2015, 17:03
	1) http://habrahabr.ru/post/120917/ 2) http://xdan.ru/Working-with-fi... asics.html 1

@Mr_Progger 24 / 24 / 16 Регистрация: 01.11.2013 Сообщений: 196
	27.05.2015, 07:21 [ТС]
	alexsamos33, сервер ПХП не поддерживает. Хранить файл на сервер я предполагал в строковой переменной. На самом деле мне необходимо получить просто двоичное представление файла, а отправлю я это обычным ПОСТ запросом при необходимости разделив этот двоичный текст на части. Получать с сервера эту же двоичную строку и делать обратное преобразование. Сервер это железка на сигнальном процессоре и файловой системы как таковой там нет, я тупо слушаю 80 порт по протоколу tcp/ip. 0