Как я могу получить Gmail-подобные загрузки файлов для моего веб-приложения?

Question

Я хочу добавить gmail-подобную функцию загрузки файлов для одного из моих проектов. Кто-нибудь может мне помочь с этим?

Мое приложение встроено в vb.net.

Буду признателен за любую помощь или руководство.

Спасибо

Answer 1

Проверьте SWFUpload , который, по сути, представляет собой API-интерфейс javascript для абсолютно превосходных возможностей Flash при обработке загрузки файлов. Лучше всего, пока браузеры наконец не догонят.

Из ссылки:

• Загрузка нескольких файлов одновременно с помощью ctrl / shift-selection в диалоговом окне
• Обратные вызовы Javascript для всех событий
• Получить информацию о файле перед началом загрузки
• Стиль загрузки элементов с использованием XHTML и css
• Отображение информации во время загрузки файлов с использованием HTML
• Нет необходимости в перезагрузке страницы
• Работает на всех платформах / браузерах с поддержкой Flash.
• Изящно понижается до обычной формы загрузки HTML, если Flash или JavaScript недоступен
• Контроль размера файла перед началом загрузки
• Отображать только выбранные типы файлов в диалоге
• Очередь закачек, удаление / добавление файлов перед началом загрузки

Демонстрация

----- загрузка iframe -----

Для начала вы хотите разместить на своей странице iframe. Это предназначено для связи с сервером. Вы будете скрывать это позже, но пока держите это видимым. Присвойте этому iframe атрибут name, например, «uploader» или что-то в этом роде.

Теперь в вашей форме установите в качестве цели имя iframe, а в качестве действия - сценарий, который вы используете на сервере, который будет принимать загрузку файла (как обычная форма с загрузкой файла). Добавьте ссылку внутри этой формы с текстом «Добавить файл». Установите эту ссылку для запуска функции JavaScript, которая добавит новый ввод в форму. Это можно сделать с помощью DOM, но я бы порекомендовал библиотеку javascript, например jquery .

После того, как новый ввод файла добавлен в форму, установите событие размытия этого ввода в функцию javascript, которая будет отправлять форму, а затем периодически проверять ее на предмет вывода. Чтение iframe может быть сложным, но это возможно.

Пусть ваш скрипт выгрузки файлов выдает "Done". или имя файла или что-то еще, когда загрузка будет завершена.

Проверяйте это каждую секунду или около того, пока не появится контент. Получив контент, убейте свой таймер и замените введенный файл именем файла (или «Файл загружен») или любым другим.

Скройте свой iframe с помощью css.

Answer 2

от YUI! (Пользовательский интерфейс Yahoo), https://yuilibrary.com/yui/docs/uploader/

1. Выбор нескольких файлов в одном диалоге «Открыть файл».
2. Фильтры расширения файлов для облегчения выбора пользователя.
3. Отслеживание прогресса при загрузке файлов.
4. Диапазон метаданных файла: имя файла, размер, дата создания, дата изменения и автор.
5. Набор событий, отправляемых по различным аспектам процесса загрузки файла: выбор файла, процесс загрузки, завершение загрузки и т. Д.
6. Включение дополнительных данных в файл загрузки POST-запроса.
7. Ускоренная загрузка файлов по широкополосным соединениям благодаря измененному размеру буфера SEND.
8. Ответ сервера на той же странице после завершения загрузки файла.

Абсолютно бесплатно

Answer 3

Вот клон загрузчика Gmail . Это точный клон загрузчика Gmail с некоторыми дополнительными возможностями. Вы можете увидеть эскизы изображений после загрузки, Перетащите эскизы, чтобы изменить порядок и заменить любой эскиз. Это делается с помощью jQuery . Вы можете увидеть демо здесь . Исходный код можно бесплатно скачать в одном zip-файле .

Я надеюсь, что вы можете легко удалить некоторый код и получить желаемую вещь. Вы можете оставлять комментарии в блоге ABCoder, если вам нужна дополнительная помощь.

Answer 4

Прошло уже 2 года, я использовал uploadify в своей прежней системе, и она работает хорошо. но вам нужно написать некоторый хак-код (например, удержать сеанс).

Я рекомендую вам использовать jquery upload , который представляет собой чистый HTML, без swf, без проблем с сессиями и действительно великолепен!

== 2013 г., что я написал:

Я обдумываю, какой выбрать, SWFupload или uploadify .

но на официальном сайте SWFupload говорится, что он не находился в стадии активной разработки, и автор надеется, что когда-нибудь SWFupload сможет возродиться ...

итак ... Я решил попробовать "uploadify", который поддерживает множество опций, обратные вызовы с большим количеством демонстраций. (после проверки его исходного кода, я предполагаю, что автор оборачивает "SWFupload v1" и "SWFupload v2" в свою "uploadify v3" ...)

и есть полный список подобных загрузчиков .

Answer 5

Вместо этого вы можете использовать Flickr Uploader клон.

Answer 6

Вы говорите о загрузке без полной обратной передачи страницы? Взгляните на http://www.phpletter.com/Demo/AjaxFileUpload-Demo/,, который создает скрытый iframe, копирует элемент управления вводом и использует iframe для выполнения публикации, чтобы получить файл на сервере.

Если вы ищете поведение, когда пользователь нажимает «прикрепить файл» и автоматически открывается диалоговое окно просмотра файлов, это можно сделать с помощью Javascript, но не работает в FireFox, который требует мер безопасности, требующих пользователь должен вызывать кнопку «Обзор» напрямую (а не программно через скрипт).

Для «автоматической» загрузки используйте Javascript, чтобы присоединить к событию «change» свойство «value» элемента управления «input», чтобы оно выполнялось при выборе файла.

Answer 7

Для решения без флэш-памяти вы можете использовать NeatUpload . Я использовал его в обширном проекте в прошлом году с требованием отсутствия вспышки. Это очень легко интегрировать в существующие решения. Я думал, что это был бриз работать с. В моем ограниченном опыте это проще, чем работать с SWFUpload в ASP.NET. Возможно, потому что NeatUpload построен только для ASP.NET.

Answer 8

Вы можете использовать iFrames для этого

Answer 9

Код Gmail трудно найти, но если бы мне пришлось угадывать, вот как это работает:

• Когда вы нажимаете «прикрепить другой файл», он вставляет элемент управления файлом обычного типа. В IE он также может программно вызывать событие click на кнопке «Обзор», поэтому диалоговое окно файла открывается немедленно (в Firefox этого не происходит, и IE у меня под рукой нет, но я считаю, что IE это позволяет)
• После выбора файла он обнаруживает событие изменения элемента управления вводом и запускает таймер.
• Когда срабатывает таймер, он отсоединяет элемент ввода от формы и добавляет его в другую форму в скрытом фрейме, помещая простую ссылку в основную (видимую) форму. Затем скрытый iframe отправляется для загрузки файла. (Он также может клонировать элемент ввода, но я не пробовал, работает ли это.)

Answer 10

Мне бы хотелось немного больше разъяснений о загрузке файлов в стиле "Gmail".

Вы имеете в виду, как, если он сидит немного, он автоматически присоединяет его к черновику?