2
問題： 當我啓動任何瀏覽器時，它會打開它的默認網頁，我打開一個會話到我的 測試文件上傳進度條Web應用程序在該標籤中，或同一個Web App。在一個新的標籤。當我 開始第一次文件上傳時，即使文件仍在上傳 ，它也會顯示進度條直接到100％。如果我再次執行文件上傳，它會按預期工作，進度條顯示加載的文件爲 ，例如20％，43％，80％，98％，然後完成。 我正在使用發佈的示例： - https://www.sitepoint.com/tracking-upload-progress-with-php-and-javascript/僅當第一次上傳時，進度條直接顯示爲100％，上傳顯示如預期
我已經稍微修改它以努力瞭解發生了什麼。
在我的網站上Internet和我的本地服務器上發生此問題。 這兩個系統都是使用Apache2的LINUX。互聯網上的網站使用PHP 5.6.30。我的本地服務器 正在使用PHP 7.1.5。
使用運行Safari，Chrome或FireFox的手機時，可能會再現同樣的問題。 因此，這看起來像基於服務器的問題或我在客戶端 或服務器端的一些編碼問題。
我使用這種類型的代碼上傳視頻文件，我的工作是假定文件 將不會完全上傳，直到至少在第一個進度百分比加載計算之後。如果我在第一次通過時獲得'100'回覆，我認爲進度條讀數錯誤，並建議 應該再次嘗試上傳文件。第二次上傳始終有效。在我的情況下，視頻文件28MB允許的最大尺寸爲 。
有人可以協助解決這個問題嗎？
下面是我的兩個PHP網頁的副本。
File: progress.php
<?php
session_start();
$key = ini_get("session.upload_progress.prefix") . "form_60";
if (!empty($_SESSION[$key]))
{
$current = $_SESSION[$key]["bytes_processed"];
$total = $_SESSION[$key]["content_length"];
echo $current < $total ? ceil($current/$total * 100) : 100;
} else
{
echo "100";
}
?>
File: upload2.php
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST" && !empty($_FILES["userfile"])) {
// move_uploaded_file()
$folder = "tmp/";
//upload the file
move_uploaded_file($_FILES["userfile"["tmp_name"], "$folder" . $_FILES["userfile"]["name"]);
}
?>
<html>
<head>
<title>File Upload Progress Bar</title>
<style>
#bar_blank {
border: solid 1px #000;
height: 20px;
width: 300px;
}
#bar_color {
background-color: #006666;
height: 20px;
width: 0px;
}
#bar_blank, #hidden_iframe {
display: none;
}
</style>
</head>
<body>
<div id="bar_blank">
<div id="bar_color"></div>
</div>
<div id="Message"></div>
<form action="" method="POST"
id="form_60" enctype="multipart/form-data" target="hidden_iframe">
<input type="hidden" value="form_60"
name="<?php echo ini_get("session.upload_progress.name"); ?>">
<input type="file" name="userfile"><br>
<input type="submit" value="Start Upload">
</form>
<iframe id="hidden_iframe" name="hidden_iframe" src="about:blank"></iframe>
<!script type="text/javascript" src="upload2.js"></script>
<script type="text/javascript">
var FirstTime = 'Y';
function toggleBarVisibility() {
var e = document.getElementById("bar_blank");
e.style.display = (e.style.display == "block") ? "none" : "block";
}
function createRequestObject() {
var http;
if (navigator.appName == "Microsoft Internet Explorer") {
http = new ActiveXObject("Microsoft.XMLHTTP");
}
else {
http = new XMLHttpRequest();
}
return http;
}
function sendRequest() {
var http = createRequestObject();
http.open("GET", "progress.php", false); // was GET
http.onreadystatechange = function() { handleResponse(http); };
http.send(null);
}
function handleResponse(http) {
var response;
if (http.readyState == 4) {
response = http.responseText;
document.getElementById("bar_color").style.width = response + "%";
document.getElementById("Message").innerHTML = response + "%";
alert(response);
if (response < 100) {
FirstTime = 'N'
setTimeout("sendRequest()", 1000);
}
else {
alert(response);
toggleBarVisibility();
if (FirstTime == 'N')
{
document.getElementById("Message").innerHTML = "Done.";
}
if (FirstTime == 'Y')
{
document.getElementById("Message").innerHTML = "Error.";
alert('System error, please try again.')
}
}
}
}
function startUpload() {
toggleBarVisibility();
setTimeout("sendRequest()", 1000);
}
(function() {
document.getElementById("form_60").onsubmit = startUpload;
})();
</script>
</body>
</html>
我現在已經找到了一個解決方法，下面列出了一個解決方法。它涉及從我的應用程序中的啓動頁面執行虛擬請求。在我的情況下，我使用登錄網頁來放置虛擬代碼。
<script type="text/javascript">
function createRequestObject() {
var http;
if (navigator.appName == "Microsoft Internet Explorer") {
http = new ActiveXObject("Microsoft.XMLHTTP");
}
else {
http = new XMLHttpRequest();
}
return http;
}
function sendRequest() {
var http = createRequestObject();
http.open("GET", "progress.php", false); // was GET
http.onreadystatechange = function() { handleResponse(http); };
http.send(null);
}
function handleResponse(http)
{
var response;
if (http.readyState == 4)
{
response = http.responseText;
if (response < 100)
{
setTimeout("sendRequest()", 1000);
}
}
}
function startUpload() {
setTimeout("sendRequest()", 1000);
}
window.onload = function() {
startUpload();
}
</script>
現在，我已經學到了一些關於會話變量似乎跟着我應該把規則： -
在session_start（）;
在upload2.php網頁的開始處，因爲這是變量信息來自第一個實例的地方。這然後工作正常。