PHP上传，提取和进度条
我需要帮助为我的php上传网站创build一个进度条。 我有上传和exctract部分sorting，但我需要进度条的帮助。 我不知道该怎么做。 另外，是否有上传的最大文件大小？
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调用发布数据并初始化进度条。 随着时间的推移animation，使酒吧“填补”。
最终，AJAX调用将完成，并将发回一个响应，完成调用后，您可以完成animation。 这是我假设大多数进度条工作的方式，因为他们通常会上升到99％左右，直到post返回“完成状态”为止。
在任何情况下，你都会有一个进度条，用<div>来表示，例如宽度会随着时间的推移而增加，或者一个数字会上升等等，而你会用JavaScript和/或jQuery。 希望这会让你开始正确的方向。
编辑
这里有一个教程的链接，描述使用AJAX 将file upload到服务器所需的步骤：使用AJAX 上传文件
