Мне нужна помощь в создании панели выполнения для моего сайта загрузки php. У меня есть отсортированная часть загрузки и exctract, но мне нужна помощь с индикатором выполнения. Я не знаю, как это сделать. Кроме того, существует максимальный размер файла для загрузки?
HTML
<?php if($message) echo "<p>$message</p>"; ?> <form enctype="multipart/form-data" method="post" action=""> <label>Choose file (.zip): <input type="file" name="zip_file" /></label> <br /> <input type="submit" value="Upload" name="submit" value="Upload" /> </form> PHP
<?php if($_FILES["zip_file"]["name"]) { $filename = $_FILES["zip_file"]["name"]; $source = $_FILES["zip_file"]["tmp_name"]; $type = $_FILES["zip_file"]["type"]; $name = explode(".", $filename); $accepted_types = array( 'application/zip', 'application/x-zip-compressed', 'multipart/x-zip', 'application/x-compressed'); foreach($accepted_types as $mime_type) { if($mime_type == $type) { $okay = true; break; } } $continue = strtolower($name[1]) == 'zip' ? true : false; if(!$continue) { $message = "[...] not a .zip file. Please try again."; } $target_path = "./".$filename; if(move_uploaded_file($source, $target_path)) { $zip = new ZipArchive(); $x = $zip->open($target_path); if ($x === true) { $zip->extractTo("./"); $zip->close(); unlink($target_path); } $message = "Your .zip file was uploaded and unpacked."; } else { $message = "There was a problem with the upload. Please try again."; } } ?>
Вы можете внести некоторые изменения, чтобы соответствовать, но это работает довольно хорошо, если вы хотите индикатор прогресса. Вы можете добавить больше eventlisteners и сделать так, как вы хотите. Надеюсь, это хорошая отправная точка для вас.
function uploadFile(){ var file = document.getElementById("zip_file").files[0]; var formdata = new FormData(); formdata.append("zip_file", file); var ajax = new XMLHttpRequest(); ajax.upload.addEventListener("progress", function(event) { runprogress(event); } , false); ajax.addEventListener("load", function(event) {uploadcomplete(event); }, false); //Target your php file. ajax.open("POST", "upload.php"); ajax.send(formdata); } function runprogress(event){ //The progress %, you might want to Math.round(percent) var percent = (event.loaded / event.total) * 100; } function uploadcomplete(event){ //This will = to your php reply. var AjaxReply=event.target.responseText; }
Насколько я знаю, для этого вам придется использовать JavaScript. Отправьте свои данные через вызов AJAX и инициализируйте индикатор выполнения. Со временем анимация его так, чтобы панель «заполнилась».
В конце концов, вызов AJAX завершится и отправит ответ, по завершении вызова вы можете закончить анимацию. Вот как я бы предположил, что большинство баров прогресса работают, поскольку они обычно поднимаются, а затем останавливаются примерно на 99%, пока сообщение не вернет статус «полный статус».
В любом случае у вас будет индикатор выполнения, представленный <div> например, с шириной, которая будет увеличиваться с течением времени, или число будет увеличиваться и т. Д. … и вы могли бы оживить это с помощью JavaScript и / или jQuery. Надеюсь, это поможет вам начать работу в правильном направлении.
РЕДАКТИРОВАТЬ
Ниже приведена ссылка на учебное пособие, описывающее шаги, необходимые для загрузки файлов на сервер с помощью AJAX: загрузка файлов с помощью AJAX