php 文件上传显示进度,美国区vps,vps买哪个地区的,新加坡vps服务器带宽对比,ukvps

🗣 Wd提问: php 文件上传显示进度

🤖 Ai回答:
在 PHP 中实现文件上传并显示进度，通常需要结合前端（如 JavaScript）和后端技术。PHP 本身无法直接实时返回上传进度，但可以通过以下方式实现：

方案一：使用 HTML5 + JavaScript（XMLHttpRequest / Fetch API）+ PHP

1、前端代码（HTML + JS）

html
<!DOCTYPE html
<html
<head
<title文件上传进度</title
</head
<body
<form id=uploadForm enctype=multipart/form-data
<input type=file name=file id=file /
<button type=submit上传</button
</form

<div id=progressContainer style=display:none;
<div id=progressBar style=width:0%;height:20px;background:green;</div
<span id=percent0%</span
</div

<script
document.getElementById('uploadForm').addEventListener('submit', function(e) {
e.preventDefault();

const formData = new FormData();
const fileInput = document.getElementById('file');
formData.append('file', fileInput.files[0]);

const xhr = new XMLHttpRequest();

// 显示进度条
document.getElementById('progressContainer').style.display = 'block';

// 上传进度事件
xhr.upload.onprogress = function(e) {
if (e.lengthComputable) {
const percent = (e.loaded / e.total) * 100;
document.getElementById('progressBar').style.width = percent + '%';
document.getElementById('percent').textContent = Math.round(percent) + '%';
}
};

xhr.onload = function() {
if (xhr.status === 200) {
alert('上传成功！');
} else {
alert('上传失败：' + xhr.responseText);
}
};

xhr.open('POST', 'upload.php');
xhr.send(formData);
});
</script
</body
</html

2、后端 PHP 文件（upload.php）

php
<?php
if ($_FILES['file']['error'] === UPLOAD_ERR_OK) {
$tmpName = $_FILES['file']['tmp_name'];
$name = basename($_FILES['file']['name']);
$uploadDir = 'uploads/';

if (!is_dir($uploadDir)) {
mkdir($uploadDir, 0777, true);
}

$destination = $uploadDir 、$name;

if (move_uploaded_file($tmpName, $destination)) {
echo json_encode(['status' = 'success', 'message' = '文件上传成功']);
} else {
http_response_code(500);
echo json_encode(['status' = 'error', 'message' = '移动文件失败']);
}
} else {
http_response_code(400);
echo json_encode(['status' = 'error', 'message' = '文件上传出错: ' 、$_FILES['file']['error']]);
}
?

注意事项：

1、`onprogress` 事件是浏览器提供的功能，可以监听上传过程中的字节传输情况。
2、PHP 配置需允许大文件上传（修改 `php.ini`）：
ini
upload_max_filesize = 100M
post_max_size = 100M
max_execution_time = 300

3、进度条仅显示到服务器的上传进度，不包括 PHP 处理时间。

方案二：使用第三方库（如 Dropzone.js、Uppy.js）

这些库封装了更友好的 UI 和进度处理逻辑，适合生产环境。

例如使用 [Dropzone.js](https://www.dropzone.dev/)

总结

使用 JavaScript 的 `XMLHttpRequest.upload.onprogress` 可以实时获取上传进度。
PHP 负责接收并保存文件。
不需要额外扩展或复杂配置即可实现基本功能。

你可以将上述代码保存为 `index.html` 和 `upload.php` 测试。

Ai作答

📣 商家广告：