Индикатор загрузки файлов на сервер
Рабочее Апрель 11th, 2008
Полезная связка JavaScript и FLASH для загрузки файлов на сервер с отображением индикатора. Предлагаю Вам видоизмененый общий перевод данной статьи. Возможно, он поможет Вам установить этот скрипт.
Возможности этого скрипта для загрузки файлов
- Выбор и загрузка нескольких файлов, индикатор загрузки файлов на сервер
- Фильтр файлов по типам в окне диалога выбора файлов
- Отображение размера файла до его загрузки
- Для работы нужен всего лишь флеш версии 8+
- Остановка загрузки, добавление файлов в очередь во время загрузки
Скрипт загрузки файлов на сервер заменяет обычный элемент выбора файла
(небольшое поле с кнопкой «Обзор…») на то, что Вы можете указать
при помощи метода createReplacement. Скрипт имеет множество настроек
и по умолчанию настроен на множественную загрузку изображений,
оформленную в виде очереди.
Нектороые замечания по установке
- Запрос, отправляемый swf файлом не содержит информации о данных из cookie, либо дополнительной информации,
которую нужно отправить post запросом.
Есть только информация о файле в $_FILES['Filedata'] с некорректным типом отправляемых данных
(application/octet-stream, а не image/gif, например, если Вы загружаете gif картинку).
Если необходимо передавать ID сессии, то это нужно делать в get запросе,
который отправляется файлу для загрузки. (например, «upload.php?SESSID=123456789abcdef»). - Если скрипт загрузки файлов на сервер работает некорректно
(элемент для загрузки файлов не заменился на то, на что Вы его заменяете методом createReplacement)
то проверьте при помощи Firebug на вкладке Net/_Flash_, загрузился ли необходимый SWF файл. - IE определяет адрес скрипта для обработки отправленных данных (upload.php)
относительно swf файла, а все остальные браузеры, относительно текущей страницы.
Поэтому, вписывайте абсолютный путь к обработчику данных отправленной формы (в атрибуте action формы), где планируется замена элементов для загрузки файлов. - SWF файл обычно вставляется после тега . В Firefox могут быть ошибки, если объект вставлен в невидимой области экрана. Нужно будет проскроллить страницу до того момента, когда этот объект сможет инициализаироваться.
В IE могут быть ошибки, если SWF объект спрятан в невидимый блок.
После этого перевода, примеры загрузки файлов на сервер легко поддаются изучению даже на английском языке :)
Описание FancyUpload находится здесь.
Чтобы посмотреть, как это сделано по-настоящему, рекомендую смотреть исходный HTML код данного примера.
Вам понядобятся 4 файла для данного скрипта: FancyUpload.js, Swiff.Base.js, Swiff.Uploader.js и Swiff.Uploader.swf. Ну и конечно же mootools :) Ссылки на них можно найти на странице описания этого скрипта либо на странице, демонстрирующей работу этого скрипта.
About
Андрей, думаю, что нельзя. Иначе это было бы сделано. Но ведь его можно получить, когда файл загрузится на сервер. Лично я не представляю, зачем его узнавать раньше. Чтобы выдать алерт о некорректном типе, можно проверить расширение файла. Так я думаю.
У меня почему то и на демо-странице и на собственной странице при загрузке файла браузер замирает на время загрузки. А потом когда уже файл по-видимому загружен прогресс-бар быстро добегает до 100%. Как то не правильно. Гораздо боле приятные впечатления у меня от этого скрипта http://www.sibsoft.net/xupload.html. Но вот не могу у себя заставить его работать. cgi-скрипт не выполняется.
izumeroot, скорее всего, пользуетесь слишком экзотическим браузер. Возможно, хром? :)
С xupload доводилось иметь дело (с PRO версией). Работает как надо, причем не нужен никакой флеш. Хорошая штука, но за деньги. А за бесплатно – я эту флешевую версию выбрал.
Нет, вовсе не экзотический. FireFox3 for Linux. =)
Xupload имеет и бесплатную версию. Вот тут у них таблица сравнения http://www.sibsoft.net/xupload.html#features . Там и демка для бесплатной версии тоже есть на сайте. Я ее и ставлю. Вот тут на моем сайте можно ошибку посмотреть в попапе. http://photos.firstvds.ru/upload_form.html
Чтобы устранить ошибку, почитайте инструкцию от провайдера, какие права должны стоять на cgi скриптах. Попросите их установить тестовый скрипт, который, обычно, выводит переменные окружения. Если он заработает, то нужно внимательнее читать инструкцию к скрипту xupload :)
Инструкцию читал 3 раза. =) Права везде стоят 777. Вот по тестовому скрипту щас поищу инфу. Спасибо!
Оказывается нельзя чтобы стояли права на запись для других пользователей для этих скриптов. Заработало. Наслаждаюсь. Версия бесплатная, код открыт =)
Мой совет – не используйте флеш-решения. Вы очень сильно будите зависеть от версии флеша у пользователей. Возможно что половина пользователей будут видеть прогресс некорректно.
Одно из решений без флеша упоминается здесь http://web-linux.ru/?p=417