powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как передать файл с помощью JavaScript
25 сообщений из 61, страница 1 из 3
Как передать файл с помощью JavaScript
    #38905896
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Народ, подскажите, как можно с помощью JavaScript передать файл на сокет. На счет картинки понятно - ее можно передать с помощью base64, а как файл?
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38905923
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
а кто мешает использовать base64
картинка от файла ничем не отличается...
data:application/bin;base64,....
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38905943
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
А ограничения на размер файла есть?
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38905961
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
qi_ip,
есть , но это надо смотреть настройки сервера
но и в это случае никто не мешает передавать файл по частям
смотри file API
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38928170
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Опять же возвращаюсь к вопросу передачи файлов/картинок через JS и Base64.
Передача на страницу картинок/файлов закодированных в Base64 небольших размеров осуществить не сложно. Проблема возникает при передачи файлов закодированных в Base64 больших размеров именно через JS (проблема с оперативной памятью).
Подскажите,
1) Как отобразить изображение на сайте большого размера? Если все сразу вытащить в переменную на страницу, браузер выкидывает "Out of memory".
2) То же самое с файлом большого размера.

Я так понимаю, можно как-то частями выгружать?
Можно ли через JS при нажатии на ссылку загрузки файла сначала открывалось окно выбора места сохранения файла, а уже потом начиналась конвертации Base64 в файл побайтно? Закодированную строку получаю из базы данных.

PS: просьба сильно не пинать, так как только начинаю в этом разбираться. Если не сложно, то киньте ссылки на примеры или в каком направлении двигаться.

Спасибо!
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38928249
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930143
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
На счет FileAPI понятно, но это можно использовать, когда файл уже есть. А я имел в виду именно получение и создание большого бинарного файла. То есть, файл нужно собрать из присланных данных.
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930287
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
из данныз формируешь блобы , соединяешь их, применяешь base64. передаешь на сервер.
а в общем не понятно задание- что и откуда получается, и что и куда передается.
в постах противоричивые данные...
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930345
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Так, полная тема:

Есть WebSocket, по нему в JS получаю файл (base64). Как его можно правильно преобразовать в большой файл (blob) на стороне клиента. С небольшими файлами проблем не возникает, но при больших файлах (> 20 МБ) браузер крешится при конверте Base64 в Blob.

Возможно можно как-то собрать файл по частям, не нагружая сильно оперативу. Может быть можно аппендить несколько Blob (не нашел как)

Как вариант для хранения сконвертированного файла рассматривал сохранение в IndexedDb.

Если коротко, то нужно получить большой файл по вебсокету (формат Base64), преобразовать на стороне клиента в файл (Blob) и отдать пользователю.

Вот, как-то так.
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930424
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
я вот таким образом получаю файл по websocket
p - это и есть строка base64

Код: javascript
1.
2.
3.
 $('#download').attr('href', p);
 document.getElementById('download').click();
<a href="" download="xxx.xlsx" id="download" ></a>


правда, у меня файлы не большие...
вот пример использования blob для формирования строки для передачи по websocket на сервер
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
var x = [];
 x.push('xxx03|full');
 x.push($(current_goods).attr('data-id'));
 x.push(s[0]);
var blob = new Blob([x.join('®')], {type: 'application/bin'});
var shorts = new Uint16Array(1);
shorts[0] = blob.size;
 var d = new Blob([shorts, blob, getBlob(img_tmp.shift())], {type: 'application/bin'});


для тебя будет интересна последняя строка - собрать один blob из нескольких....
но при больших передачах крашиться может из-за ограничения по объёму разовой передачи по websocket
у меня - 16мег стоит.
но websocket может передавать и бинарные файлы - сокращение трафика и времени на передачу
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930446
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
вадяя вот таким образом получаю файл по websocket
p - это и есть строка base64

Код: javascript
1.
2.
3.
 $('#download').attr('href', p);
 document.getElementById('download').click();
<a href="" download="xxx.xlsx" id="download" ></a>


правда, у меня файлы не большие...
вот пример использования blob для формирования строки для передачи по websocket на сервер
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
var x = [];
 x.push('xxx03|full');
 x.push($(current_goods).attr('data-id'));
 x.push(s[0]);
var blob = new Blob([x.join('®')], {type: 'application/bin'});
var shorts = new Uint16Array(1);
shorts[0] = blob.size;
 var d = new Blob([shorts, blob, getBlob(img_tmp.shift())], {type: 'application/bin'});


для тебя будет интересна последняя строка - собрать один blob из нескольких....
но при больших передачах крашиться может из-за ограничения по объёму разовой передачи по websocket
у меня - 16мег стоит.
но websocket может передавать и бинарные файлы - сокращение трафика и времени на передачу


То есть, можно на стороне клиента получать бинарный файл? А как его обработать? Опять же получается. что все будет накапливаться в оперативке и при большом файле опять же крешниться.
Есть какие-то нюансы при передачи/получении через WebSocket на клиент бинарный файл?
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930453
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
qi_ipТак, полная тема:

Есть WebSocket, по нему в JS получаю файл (base64). Как его можно правильно преобразовать в большой файл (blob) на стороне клиента. С небольшими файлами проблем не возникает, но при больших файлах (> 20 МБ) браузер крешится при конверте Base64 в Blob.

Возможно можно как-то собрать файл по частям, не нагружая сильно оперативу. Может быть можно аппендить несколько Blob (не нашел как)

Как вариант для хранения сконвертированного файла рассматривал сохранение в IndexedDb.

Если коротко, то нужно получить большой файл по вебсокету (формат Base64), преобразовать на стороне клиента в файл (Blob) и отдать пользователю.

Вот, как-то так.зачем этот гемор?

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



и дать пользователю ссылку на скачивание?

а браузер правильно крашится. нефиг втихаря забивать мне localStorage всяким многогигабайтным гуано, hdd не резиновый и не казенный.
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930460
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Antonariyqi_ipТак, полная тема:

Есть WebSocket, по нему в JS получаю файл (base64). Как его можно правильно преобразовать в большой файл (blob) на стороне клиента. С небольшими файлами проблем не возникает, но при больших файлах (> 20 МБ) браузер крешится при конверте Base64 в Blob.

Возможно можно как-то собрать файл по частям, не нагружая сильно оперативу. Может быть можно аппендить несколько Blob (не нашел как)

Как вариант для хранения сконвертированного файла рассматривал сохранение в IndexedDb.

Если коротко, то нужно получить большой файл по вебсокету (формат Base64), преобразовать на стороне клиента в файл (Blob) и отдать пользователю.

Вот, как-то так.зачем этот гемор?

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



и дать пользователю ссылку на скачивание?

а браузер правильно крашится. нефиг втихаря забивать мне localStorage всяким многогигабайтным гуано, hdd не резиновый и не казенный.
Связь только по Websocket, поэтому не получается просто взять и дать пользователю.
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930481
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
для нормального приёма бинарника нужна вторая строка
Код: javascript
1.
2.
con = new WebSocket("wss:..........");
con.binaryType = "arraybuffer";


она не влияет на прём текстовых данных.

в моём примере нет необходимости связавыться с blob.
проверь, может и для длинных файлов подойдет
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930489
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
qi_ipСвязь только по Websocket, поэтому не получается просто взять и дать пользователю.Для того, чтобы был вебсокет, сначала должен быть http.

Для установления соединения WebSocket клиент и сервер используют протокол, похожий на HTTP. Клиент формирует особый HTTP-запрос, на который сервер отвечает определенным образом. Куда девается HTTP?

И вообще, единственный способ создать большой файл браузером — скачать его. Без вариантов (не считая ADODB.Stream).
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930501
Фотография Konst_One
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
ну ещё можно вспомнить про WebDAV
https://github.com/sara-nl/js-webdav-client
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930506
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
вот описание по работе с файлами
http://habrahabr.ru/post/112286/
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930525
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
вадявот описание по работе с файлами
http://habrahabr.ru/post/112286/ а ты его читал?
С помощью FileSystem API и File API веб приложение может создавать, читать, просматривать и записывать файлы находящиеся в области пользовательской «песочницы».размер песочницы - 5 мб. даже в память ТС загружает больше.
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930555
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
и кроме того только для хрома :)
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930568
Фотография Petro123
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
qi_ipСвязь только по Websocket
это чтоб сложнее было? ))
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930569
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Petro123qi_ipСвязь только по Websocket
это чтоб сложнее было? ))
Тут я ничего не могу поделать - такие условия выполнения. Поэтому тут на форуме темку создал, чтобы узнать, как сделать :)
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930608
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
http://updates.html5rocks.com/2011/08/Saving-generated-files-on-the-client-side
там же ссылка https://github.com/eligrey/FileSaver.js
а это пробовал?

Код: javascript
1.
2.
3.
 $('#download').attr('href', p);
 document.getElementById('download').click();
<a href="" download="xxx.xlsx" id="download" ></a>
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930629
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Там используются уже готовые бинарные объекты...а я еще до бинарника не дошел, так как застопорился на создании самого бинарника из Base64
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930631
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Petro123qi_ipСвязь только по Websocket
это чтоб сложнее было? ))

ну через websocket много решается намного проще, чем через ajax
особенно мне понравилось такая картинка
...
Рейтинг: 0 / 0
Как передать файл с помощью JavaScript
    #38930639
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
qi_ipТам используются уже готовые бинарные объекты...а я еще до бинарника не дошел, так как застопорился на создании самого бинарника из Base64
в моём варианте бинарник не используется!
если у тебя приходит base64, сделанный из бинарника надо добавить в начало data:application/bin;base64,
и все подставить вместо p
data:application/bin;base64, - лучше добавить на сервере(если есть такая возможность, у меня так сделано)
...
Рейтинг: 0 / 0
25 сообщений из 61, страница 1 из 3
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как передать файл с помощью JavaScript
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]