Загрузка файлов на сервер как на Gmail?

Question

[niko83]

Как реализовать и может есть готовые решения реализации процесса загрузки файлов на сервер как на Gmail.


Напомню особенности:

*) multiAttach, можно за раз прикрепить несколько файлов, а не тыкаться по одному

*) progressBar, выбранные файлы грузятся последовательно + индикация процесса загрузки каждого файла

*) Загрузку файла можно прервать или удалить отдельный файл из уже загруженных, или удалить из очереди файл который ещё не начал загружаться.

*) может что-то ещё не усмотрел полезное

Answer 1

[vixh]

вот список наиболее популярных stackoverflow.com/questions/4072889/uploadify-alternative-need-to-upload-large-1gb-files

Я сам использую третий(производный от первого), работает даже на ИЕ6. Прогрес бар и отмену можно взять у первого. Эти два без флеша, HTML4

Answer 2

[zt50]

www.plupload.com/

Answer 3

[Mikhail Davydov]

Использовал вариант с PHP+APC www.ibm.com/developerworks/library/os-php-v525/index.html Все красиво, без лишних плагинов и без флэша.

Answer 4

[B@rmaley.e><e]

Если не трогать всякие флешы и серверные компоненты, то можно сделать на основе функционала, предлагаемого HTML5. Проблема лишь в том, что вводится он медленно и поддерживается браузерами фигово:

1. Хром: начиная с 5-ой (?) версии добавили FormData (из XHR2). Теперь можно отсылать файлы (несмотря на то, что прочитать бинарное содержимое файла пока нельзя, во всяком случае в стабильных релизах) XHR'ом (а там, напомню, нужен multipart). В ранних версиях приходилось отправлять сырое бинарное содержимое файла, без каких-либо заголовков. Соответственно, веб-серверы не понимали, что им пришел файл, и вообще никак не обрабатывали присланную информацию (ее приходилось читать из входного потока). Есть поддержка XMLHttpRequestUpload, который позволяет мониторить прогресс загрузки.

2. Firefox: начиная с 3.5 (?) можно читать содержимое файлов, есть специальный метод для отправки двоичных данных. Так что отсутствие FormData ничем плохим не сказывается — multipart запрос можно сформировать самому. XMLHttpRequestUpload так же поддерживается.

3. Сафари: точка сказать не могу, но File, FormData, XMLHttpRequestUpload там реализованы (5.0 — 7533.16).

4. Опера, ИЕ: видимо, даже не слышали о таких. Для них придется делать по-старинке — флеш / серверсайд / etc.

Из разряда почитать:
javascript.ru/blog/Brmaley.ee/FileAPI — материал несколько устарел*
www.thecssninja.com/javascript/gmail-upload — материал несколько устарел*
code.google.com/p/html5uploader/ — библиотечка для D&D, но, на мой взгляд, она тоже несколько устарела* :)

* — имеется в виду поддержка такой штуки как FormData.

Answer 5

[dsn13]

Существует такой интересный плагин valums.com/ajax-upload/

Answer 6

[Александр]

прогрессбары реализуются на JQuery куча готовых компонентов
есть решения на флеше

если используется nginx, а это большая часть рунета, то необходимо исп модуля:
ngx_upload_module, mgx_upload_progress_module

если использовать апач, то есть cgi скрипты прогресс-загрузки.

Comments

[Александр]

читаем доку все банально просто

Answer 7

[not_ice]

По-моему самая интересная и полезная особенность gmail — поддержка drag'n'drop :)

Comments

[FeNUMe]

www.kigorw.com/articles/dd-file

[B@rmaley.e><e]

Вот, о чем я говорил: большинство статей на эту тему написаны в апреле-мае этого года, а на тот момент FormData не был реализован в хроме, из-за чего приходится отсылать сырые двоичные данные и читать их из входного потока (request.raw_post_data). То ли дело полноценный multipart, который идентичен обычной отправке файлов браузером.

Answer 8

[niko83]

всем спасибо за советы, предложения и рекомендации, сейчас буду переваривать информацию и мотать на ус

Answer 9

[Dmitry Dedukhin]

lwu.no-ip.org/

Поддерживает html5, flash и silverlight загрузку, успешно откатывается при наличии банерорезок.
На мой взгляд, имеет набор событий для реализации любых желаний.
Всю кастомизацию очереди загрузки делаете вы сами.
Поддерживает дозагрузку в случае обрыва соединения (только в html5 и silverlight).
Поддерживает междоменную загрузку файлов.
Работает только с nginx + nginx_upload_module, хотя при желании можно реализовать протокол возобновляемой загрузки www.grid.net.ru/nginx/resumable_uploads.ru.html в других серверных компонентах.