Javascript 仅在第一次上传时,进度条会直接变为100%,之后的上传会如预期的那样显示
问题: 当我启动任何浏览器时,它会打开其默认网页,我会打开一个会话到我的 使用该选项卡中的进度条Web应用程序或同一Web应用程序上载测试文件。在新选项卡中。当我 开始第一次文件上传,它会显示进度条,即使文件仍在上传,也会直接转到100% 上传。如果我再次上传文件,它会按预期工作,进度条会显示正在上传的文件 加载,例如20%、43%、80%、98%,然后完成。 我使用的示例发布在: 我稍微修改了一下,试图找出到底发生了什么 此问题发生在Internet上的网站和本地服务器上。 这两个系统都是LINUX,使用Apache2。互联网上的网站使用PHP5.6.30。我的本地服务器 正在使用PHP7.1.5 当使用运行Safari、Chrome或FireFox的手机时,同样的问题也会重现。 这看起来像是一个基于服务器的问题,或者是我在客户端遇到的一些编码问题 或服务器端 我使用这种类型的代码上传视频文件,我的解决方法是假设文件 至少在第一次进度加载百分比计算之后,才会完全上载。如果我 在第一次通过时得到“100”回复我假设进度条读数是错误的,并建议 应再次尝试文件上载。第二次上传总是有效的。在我的情况下,最大 视频文件允许的大小为28MB 有人能帮忙解决这个问题吗 下面是我的两个PHP网页的副本Javascript 仅在第一次上传时,进度条会直接变为100%,之后的上传会如预期的那样显示,javascript,php,file-upload,upload,Javascript,Php,File Upload,Upload,问题: 当我启动任何浏览器时,它会打开其默认网页,我会打开一个会话到我的 使用该选项卡中的进度条Web应用程序或同一Web应用程序上载测试文件。在新选项卡中。当我 开始第一次文件上传,它会显示进度条,即使文件仍在上传,也会直接转到100% 上传。如果我再次上传文件,它会按预期工作,进度条会显示正在上传的文件 加载,例如20%、43%、80%、98%,然后完成。 我使用的示例发布在: 我稍微修改了一下,试图找出到底发生了什么 此问题发生在Internet上的网站和本地服务器上。 这两个系统都是L
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>
文件:progress.php
文件:upload2.php
文件上载进度条
#棒材坯料{
边框:实心1px#000;
高度:20px;
宽度:300px;
}
#条形图颜色{
背景色:#006666;
高度:20px;
宽度:0px;
}
#栏空白,#隐藏#iframe{
显示:无;
}
会话开始时似乎没有读取if语句。如果会话不存在,您只需100%回显。如果您终止此部分:
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 {
$_SESSION[$key]["bytes_processed"] = 0;
}
?>
它不应该直接跳到100%,因为此时会话将处于活动状态,而不是在第一次上传之后。没有经过测试,但值得一试,如果你不抢先一步,当我有机会做一个正确的测试时,我会把这段代码放在我的测试服务器上
<?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 {
$_SESSION[$key]["bytes_processed"] = 0;
}
?>