Хочется рассказать как сделать загрузку файлов, используя uploadprogress (должен установлен у хостера, у меня нет проблем т.к. collocation) и jquery. Загрузку файлов может лучше на flash реализовать, но т.к. я не силен во flash.... Чем хорош данный метод: можно легко подогнать под дизайн сайта показывает скорость загрузки сколько загруженно время до завершения загрузки в процентах сколько загруженно Для начала скачайте и подключите jquery.js: http://jquery.com/ PHP: <head> .... <script src="/js/jquery.js" type="text/javascript"> ... </head> Пример формы для загрузки файла: PHP: // нужен, что бы убрать лишнее после нажатия на кнопку ЗАГРУЗКИ <div id="form_upload" style="display: block;"> //форма для загрузки <form action="/upload.php" method="POST" id="upload" name="upload" enctype="multipart/form-data"> <input type="file" name="uploadfile" title="Добавить файл" /> // присваиваем файлу уникальный номер, что бы потом его контролировать <input type="hidden" name="UPLOAD_IDENTIFIER" value="1234"> // не люблю стандартные кнопки submit +) <a onclick="startStatus();" href="javascript:document.upload.submit()">Загрузить</a> </form> // end: форма для загрузки </div> // необходимо, что бы показывать информацию для пользователя <!-- progress bar--> <div id="progress_bar"> <div id="bg"><div id="bar" class="bar"></div><div id="pers"></div></div> <div id="info" > <div id="in1"></div> <div id="in2"></div> </div> </div> <!-- //progress bar--> Созадать файл info.php: из которого по uid будем получать данные о файле. PHP: <?php $status = uploadprogress_get_info($_POST['uid']); echo json_encode($status) ; ?> href="javascript:document.upload.submit()" upload - это имя формы. startStatus(); - функция javascript - после нажатия на кнопку загрузки, начинаем получать информацию о загружаемом файле. Функция startStatus(): PHP: function startStatus() { // убираем форму для загрузки файла $("#form_upload").fadeOut(); //показываем информацию о загружаемом файле $("#progress_bar").fadeIn(); //через 1.5 сек. начинаем смотреть состояние файла setTimeout('getStatus()', 1500); } Функция getStatus() : PHP: function getStatus() { //из файла info.php получаем данные $.getJSON("/info.php",{ uid: "1234", // уникальный номер файла math: Math.random() }, function(data){ timelast=data.time_last; // размер загружаемого фала total = data.bytes_total; // скорость казгрузки b/s speed = data.speed_average; //загружено байт bytes = data.bytes_uploaded; // времени до окончания загрузки eta = data.est_sec; //переводим в минуты время min = Math.round(eta / 60); //секунды sec = eta - min*60; // показываем мин +сек. или секунды if(min==0){time=sec+" сек."}else{time=min+" мин."+sec+" сек."} //добавляем информацию о времени и скорости в <div id="in1"... используя функцию [B]speeds()[/B] $("#in1").html(time+" ("+speeds(speed)+")"); //добавляем в <div id="in2"... информацию о сколько загрузили и процентах, используя функцию [B]fsize()[/B] она будет описана ниже $("#in2").html(fsize(bytes)+"/"+fsize(total)+"("+Math.round(bytes * 100 / total) + "%"+")"); //рисуем строку загрузки файла progressdata(bytes,total); // добавляем в центр загрузки проценты <div id="pers"... $("#pers").html(Math.round(bytes * 100 / total) + "%"); }); //вызываем каждую секунду данную функцию, что бы обновлять данные загрузки файла setTimeout('getStatus()', 1000); } функции fsize() и speeds() можно объеденить в одну функцию+) : PHP: function fsize (x) { x = Math.round(x / 1024); if (x < 1000) { return x + " " + "Кб"; } x = Math.round(x * 100 / 1024) / 100; return x + " " + "Мб"; } function speeds (x) { x = Math.round(x / 1024); if (x < 1000) { return x + " " + "Кб/сек"; } x = Math.round(x * 100 / 1024) / 100; return x + " " + "Мб/сек"; } Функция progressdata() : PHP: function progressdata(bytes,total) { // увеличиваем ширину <div id="bar"... т.е. строку загрузки файла $("#bar").css("width",Math.round(bytes * 100 / total)+"%"); } Добавляем стили css: PHP: <style type="text/css"> #progress_bar{ position:relative; width:300px; display: none; margin:15px 0 0 0px; } #in1{ float:left; position:relative; } #in2 { float:right; position:relative; } #bg{ width:300px; border:1px solid black; height:10px; display:block; } #info { color:gray; } .bar{ position:relative; background:#FFBE26; height:10px; //картинка индикации background-image:url(/images/uploadprogress_bggreen.png); background-repeat: repeat-x; width:0%; } #pers{ position:relative; text-align: center; color: black; font-size:9px; left:145px; top:-10px; float:left; } </style> Вот что у меня получилось: P.S. Не судите строго, первая статья +) Спрашивайте если что то непонятно, подробнее обьясню... P.S.2 При использовании nginx не работает uploadprogress... в инете найдется инфа как это исправить, но не стоит этого делать, лучше создать домен 3 уровня, где frontend apache... Практически аналогичный загрузчик можно сделать используя php_apc.... если хотите напишу статейку +)
Нормалльно,если конечно сам писал!больше похоже на перевод Cсылки по теме: Модуль uploadprogress Code: http://pecl.php.net/package/uploadprogress Модуль Alternative PHP Cache (APC) Code: http://pecl.php.net/package/APC Ну и реализация с использыванием APC Code: http://t.wits.sg/2008/06/25/howto-php-and-jquery-upload-progress-bar/
Я не занимаюсь переводом чужих статей +) Для своего сайта написал загрузчик, вот решил поделиться, может кому нужно. Кстати, http://t.wits.sg/2008/06/25/howto-php-and-jquery-upload-progress-bar/ лучшая статья которую я находил в инете +)
А можно прицепить полностью исходники, а то мне как раз такой скрипт надо, а из статьи пытался слепить, че-то не работает uploadprogress у меня установлен...
