Ajax uploader

Недавно понадобилось в галерее сделать аплоад. После поисков ajax uploader’a решил сделать свой.Недавно понадобилось в галерее сделать аплоад. После поисков ajax uploader’a решил сделать свой позаимствовав некоторые запчасти от Fancy Upload (Кстати только у меня его индикатор движется как то непропорционально?)

Как и Digitarald я  применил  mootools фреймворк.

Серверная часть позаимствована от Steve Miles ajax uploader :)

Требования от хостинга:

  1. Выполнение cgi скриптов.
  2. Установленный Perl.
  3. PHP (4 или 5)

Возможности:

  1. Закачивать большие файлы на сервер. ( Вы не ограничены директивами max_post_size или max_upload_size и т.п.)
  2. Во время загрузки файла отображается индикатор прогресса. (Также возможно отображать скорость и расчетное время конца загрузки)
  3. Сделать ajax аплоад опциональным. Тоесть пользователь может выбрать для себя режим загрузки.

Данный скрипт удобно применять в система где уже есть аплоад и хотелось бы сделать прогрессбар с минимумом прилагаемых усилий.

Я сделал пример на котором можно разобраться как это работает. Также этот пример можно полностью скачать со всей иерархией папок и нужными файлами.

Пример upload.tpoxa.com

Первый вариант – обычный.

<form action="postscript.php" enctype="multipart/form-data" method="post" id="myaupload">
<fieldset>
<legend>Закачайте файл</legend>
<p>
<label for="filename">Название файла</label>
<input type="text"  size="40" id="filename" name="filename" />
</p>
<p>
<label for="file">Файл</label>
<input type="file" id="file" name="file" />
</p>
<p>
<input type="submit" name="goupload"  />
</p>
</fieldset>
</form>

Скрипт postscript.php отображает значения суперглобальных массивов $_POST и $_FILES
Обычно мы используем функцию move_uploaded_file котороя переместит файл в папку для постоянного хранения

В случае же «аякс загрузки» это делает наш cgi скрипт который закачивает файл сначала во временное хранилище потом в любую папку которую мы укажем.
В результате postscript.php не получит никаких данных в $_FILES но зато в $_POST будет уже локальный (размещенный на сервере) адрес загружаемого файла.
В общем советую поиграться на примере.

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

<script type="text/javascript">
 window.addEvent('domready', function() {
  var UploadeManagerObj = new UploadeManager('myaupload',{});
 })
</script

«myaupload» – Это ID нашей формы.

Настройка.

Настройка сводится к заливке всех файлов на сервер и установки прав на них.

Папки tmp и upload должны быть записуемыми для PHP.  CHMOD 777

У /cgi-bin/upload.cgi – должны быть права для запуска CHMOD 755

Для отладки советую включить DEBUG режим при котором iframe в который «сабмитится» форма будет видим

<script type="text/javascript">
 window.addEvent('domready', function() {
  var UploadeManagerObj = new UploadeManager('myaupload',{debugmode:true});
 })
</script

Если появятся какие вопросы с радостью отвечу.
uploader.zip