Предисловие
Загрузка файлов всегда занимала особое место в веб-разработке.
О сложности укладки уже сказано немало.
; об этом можно прочитать, например, перейдя по ссылкам один раз , два , три , четыре , пять , шесть .
Но сам процесс скачивания файлов нетривиален; есть много разных способов – и ни одного идеального.
О реализации на нашем проекте я уже писал Файлы@Mail.Ru серебристыйлегкий погрузчик Полгода назад .
В то время мы поддерживали iframe, flash, silverlight и обычную загрузку файлов.
Но прогресс не стоит на месте, и теперь последние бета-версии всеми любимых браузеров полностью поддерживают html5 FileAPI (справедливости ради стоит отметить, что некоторая поддержка, как обычно, уникальна, но об этом ниже).
Пока писалась эта статья, Chrome 9 был объявлен стабильным и вынужденным 75% установок версии 8 уже обновлены.
.
Итак, отмечаем поддержку File API как первого стабильного браузера, ура! Мы думали, что неиспользование такой технологии будет преступлением против пользователей.
Мы подумали об этом и добавили загрузку html5 в дополнение к уже существующим опциям.
В результате наши пользователи получили множество преимуществ: — прозрачная перезагрузка после потери соединения (и даже перезапуска браузера!); — очередь загрузки; — индикатор выполнения (пользователи MacOS и Safari наконец-то смогут видеть прогресс без каких-либо посторонних плагинов), возможность удалять файлы из очереди, если передумаете.
Используя File API, мы можем программно, из кода JavaScript: 1. получить список выбранных в диалоге файлов, их размеры и mime-типы (на что, кстати, не стоит рассчитывать, поскольку браузеры не распознают некоторые популярные типы файлов по расширению).
2. получить из файла необходимый диапазон байт, не загружая все содержимое файла в память (в отличие от Flash и Firefox 3 - см.
примечание 1).
3. загрузить на сервер как весь файл, так и его часть.
4. Загружайте файлы одним перетаскиванием.
5. загрузить несколько файлов одновременно (параллельно).
Те.
нам не нужны никакие плагины для работы с файлами, и это определенно очень здорово!
Басня
Сама загрузка файлов реализована в File API всего в несколько строк, но мы добавили несколько приятных функций (очередь загрузки, дополнительная загрузка при потере соединения) и код стал немного сложнее.Код загрузчика в проекте Файлы@Mail.Ru доступны и не запутаны и могут быть изучать , но он привязан к проекту и его особенностям, поэтому мы рассмотрим этот механизм загрузки в чистом виде на примере проекта легкий загрузчик .
Итак, начнем.
Мы присоединяем к входу обработчик onchange.
Теги: #Nginx #mail.ru #html5 #file api #uploaderoself.file_elm.onchange = function() {
-
Гликозиды
19 Oct, 24 -
Токен Авторизации
19 Oct, 24 -
Ос «Сивелькирия»: Миссия И Форма Запуска
19 Oct, 24 -
Много Менеджеров
19 Oct, 24
