Вы все знаете новое поколение фантазийных, в основном флеш–файлов, таких как SWFUpload, которые могут показывать индикатор выполнения при загрузке – большое улучшение, особенно для шатких и низкоскоростных соединений.
Однако эти загрузчики привносят свою логику управления загрузкой на стороне клиента. Я ищу ненавязчивый способ «ухаживать» за существующими классическими файловыми загрузками , то есть вводить индикатор выполнения в обычные формы загрузки файлов .
Из-за архитектуры загрузки файлов это, скорее всего, невозможно без некоторой настройки на стороне клиента.
Я ищу решение, которое позволяет полностью настроить настройку, например, компонент, который добавляет себя к событию onsubmit нормальной формы, выполняет загрузку файла, отображает хороший индикатор выполнения, помещает полученный временный (серверный) файл путь в форму и представляет ее. На стороне сервера мне просто нужно изменить свой скрипт, чтобы использовать путь к файлу, предоставляемый загрузчиком Flash, вместо $ _FILES и супругов, и подумайте о безопасности на мгновение.
Это не совсем то, что делают все загрузчики на основе Flash: они могут использовать данные из формы, но они не предоставляют возможности для отправки формы как есть, что я ищу. Я ищу (возможно) флеш-функцию загрузки, сделанную еще дальше .
Мы реализовали это очень просто, установив расширение PECL pecl-uploadprogress и добавив простой обратный вызов AJAX к формам:
Создайте ключ загрузки:
$upload_id = genUploadKey(); function genUploadKey ($length = 11) { $charset = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"; for ($i=0; $i < $length; $i++) $key .= $charset[(mt_rand(0,(strlen($charset)-1)))]; return $key; }
Создайте обработчик обратного вызова AJAX (например, uploadprogress.php):
extract($_REQUEST); // servlet that handles uploadprogress requests: if ($upload_id) { $data = uploadprogress_get_info($upload_id); if (!$data) $data['error'] = 'upload id not found'; else { $avg_kb = $data['speed_average'] / 1024; if ($avg_kb<100) $avg_kb = round($avg_kb,1); else if ($avg_kb<10) $avg_kb = round($avg_kb,2); else $avg_kb = round($avg_kb); // two custom server calculations added to return data object: $data['kb_average'] = $avg_kb; $data['kb_uploaded'] = round($data['bytes_uploaded'] /1024); } echo json_encode($data); exit; } // display on completion of upload: if ($UPLOAD_IDENTIFIER) { ...
Загрузите jQuery и jQuery.uploadprogress библиотеки (которые также включают в себя вышеприведенный фрагмент) и интегрируются с вашей формой:
<script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="jquery.uploadprogress.0.3.js"></script> <script type="text/javascript"> jQuery(function () { // apply uploadProgress plugin to form element // with debug mode and array of data fields to publish to readout: jQuery('#upload_form').uploadProgress({ progressURL:'uploadprogress.php', displayFields : ['kb_uploaded','kb_average','est_sec'], start: function() { $('.upload-progress').show(); }, success: function() { $('.upload-progress').hide(); jQuery(this).get(0).reset(); } }); }); </script>
Добавьте это в свою форму загрузки:
<input name="UPLOAD_IDENTIFIER" type="hidden" value="$upload_id" />
Это должно делать свое дело. Это извлекается из нашей базы кода и может не работать из коробки. Но он должен сказать вам эту идею.
Если вы используете PHP 5.2 и этот учебник по загрузке файлов IBM может вам помочь.
В этом многостраничном учебнике по загрузке файлов используется jQuery + AJAX Upload … Он использует $ _FILES на стороне сервера и преобразует специальный <div> на стороне клиента, чтобы сделать <form>. Я думаю, вы можете настроить его, чтобы он соответствовал вашим потребностям.
Если настройка последней слишком сложна, Uber-Uploader на SourceForge является еще одним вариантом.
Есть десятки проектов с открытым исходным кодом, посвященных этой теме. К сожалению, это не что-то тривиальное, чтобы реализовать плавно (по крайней мере так, как вы хотите, иначе мы бы увидели это в старые добрые дни Netscape).
С яркой стороны HTML5 облегчит это, как вы можете видеть в этой демонстрации и этой .
Надеюсь, это поможет и удачи в интеграции.
jquploader использует информацию внутри формы, такую как значение атрибута действия как сценарий загрузки. Но я не обновлял его в то время, и ему не хватает всех поясов и скриптов свиста, таких как uploadify (что отличает сценарий кстати). Посмотрите, может ли это быть базой для вас.
Использует ли техника, используемая в Uploadify (плагин jQuery), ваши потребности? демонстрация
Как смешно, я только что видел блог Саймона Уиллисона о Plupload , который представляет собой библиотеку JavaScript, которая, как мне кажется, делает переходы на уровень загрузки файлов (среди прочего).
Он использует Flash, Silverlight или что-то еще, но я думаю, что абстрагирует все это от вас, поэтому вы все равно загружаете обычную HTML-форму.
Вам нужно будет проверить размер части файла, который уже установлен на сервере, а затем получить его на клиенте на Ajax, где вы можете нарисовать индикатор выполнения. (Не забудьте проверить размер отверстия Данные раньше, чтобы вычислить percantage ;-))