我一直在尝试创建一个非Flash上传面板,该面板还显示一个进度栏。在我们的服务器上,我们有PHP 5.3(暂时无法升级到5.4,因此无法使用新的上传进度功能=> http://php.net/manual/zh-CN/session.upload- progress.php)。我们不能使用基于Flash的解决方案,扩展程序或类似方法。
因此,我尝试将XMLHttpRequest与AJAX结合使用。这里的问题是我只取得了部分成功。
我已经设法将大约380 MB的文件上传并保存在服务器上,但是,当尝试使用更大的文件(例如4 GB)时,该文件将不会保存在服务器上(如果我曾经检查过Firebug,说“ POST已中止”)。
另一个奇怪的是,对于相同的文件,xhr.upload.loaded从xhr.upload.total的相同维开始,并从此处开始计数。
有谁知道如何解决这个问题或有替代解决方案?
客户端代码为:
<script type="application/javascript" src="jquery.js"></script> <script type="application/javascript"> function uploadToServer() { fileField = document.getElementById("uploadedFile"); var fileToUpload = fileField.files[0]; var xhr = new XMLHttpRequest(); var uploadStatus = xhr.upload; uploadStatus.addEventListener("progress", function (ev) { if (ev.lengthComputable) { $("#uploadPercentage").html((ev.loaded / ev.total) * 100 + "%"); } }, false); uploadStatus.addEventListener("error", function (ev) {$("#error").html(ev)}, false); uploadStatus.addEventListener("load", function (ev) {$("#error").html("APPOSTO!")}, false); xhr.open( "POST", "serverUpload.php", true ); xhr.setRequestHeader("Cache-Control", "no-cache"); xhr.setRequestHeader("Content-Type", "multipart/form-data"); xhr.setRequestHeader("X-File-Name", fileToUpload.fileName); xhr.setRequestHeader("X-File-Size", fileToUpload.fileSize); xhr.setRequestHeader("X-File-Type", fileToUpload.type); //xhr.setRequestHeader("Content-Type", "application/octet-stream"); xhr.send(fileToUpload); } $(function(){ $("#uploadButton").click(uploadToServer); }); </script>
HTML部分:
<form action="" name="uploadForm" method="post" enctype="multipart/form-data"> <input id="uploadedFile" name="fileField" type="file" multiple /> <input id="uploadButton" type="button" value="Upload!"> </form> <div id="uploadPercentage"></div> <div id="error"></div>
服务器端代码:
<?php $path = "./"; $filename = $_SERVER['HTTP_X_FILE_NAME']; $filesize = $_SERVER['CONTENT_LENGTH']; $file = "log.txt"; $fo= fopen($file, "w"); fwrite($fo, $path . PHP_EOL); fwrite($fo, $filename . PHP_EOL); fwrite($fo, $filesize . PHP_EOL); fwrite($fo, $path . $filename . PHP_EOL); file_put_contents($path . $filename, file_get_contents('php://input') ); ?>
与Web服务器相关联的限制是PHP不能更改的。例如,它们是IIS中30 MB的默认最大邮寄请求大小…您可能还会遇到一个最大超时。与大小无关,但是您的发帖请求要花多长时间…即文件提交需要多长时间。IIS或Apache都可以限制这两个设置。