Как реализовать индикатор выполнения загрузки файла в Интернете?
-
09-06-2019 - |
Вопрос
Я хотел бы отображать что-то более значимое, чем анимированный gif, пока пользователи загружают файл в мое веб-приложение.Какие возможности у меня есть?
Редактировать:Я использую .Net, но я не возражаю, если кто-нибудь покажет мне версию, не зависящую от платформы.
Решение
Вот несколько версий того, что вы ищете для некоторых распространенных наборов инструментов JavaScript.
- Инструменты обсуждения - http://digitarald.de/project/fancyupload/
- Extjs - http://extjs.com/learn/Extension:UploadForm
Другие советы
Если вам интересно, как все это вообще работает на клиентском сайте, то это оно:
Все решения подключают форму через javascript и меняют цель forms на вновь созданный невидимый IFRAME.Затем они могут свободно использовать AJAX для запроса некоторого статуса файла с сервера.
Трюк с IFRAME необходим, потому что все скрипты, запущенные в окне, которое выполняет загрузку, будут зависать до тех пор, пока запрос не будет завершен, после чего файл будет полностью загружен.
ASP.NET Загрузка файла с помощью В режиме реального времени Индикатор выполнения
http://mattberseth.com/blog/2008/07/aspnet_file_upload_with_realti_1.html
Я пробовал различные техники и добился наибольшего успеха с SWFUpload Загрузить.
Вы создаете объект SWFUpload и взаимодействуете с ним с помощью Javascript, но для выбора файла, загрузки и мониторинга хода загрузки используется (скрытый) Flash-файл.Вы можете указать широкий спектр обработчиков событий Javascript (uploadStarted
, uploadProgress
, uploadError
и т.д.), которые Flash будет вызывать во время выполнения загрузки, что делает его очень гибким.Он также реализует очередь файлов, поэтому хорошо работает для одного или нескольких файлов.
Ссылки:
Немного полезного.Справочную информацию по созданию индикаторов выполнения для конкретной сети можно найти в статьях Дино Эспозито в журнале MSDN за июль и август прошлого года:
Контекстно-зависимая обратная связь с AJAX (июль '07)
Отмена серверных задач с помощью ASP.NET AJAX (август '07)
Приведен хороший пример того, как сделать это без использования Ajax в CodeProject от Нилеша Таккара.
Панель выполнения пользовательского интерфейса jQuery - http://jqueryui.com/demos/progressbar/