首页  >  文章  >  后端开发  >  如何使用AJAX显示文件上传的实时进度?

如何使用AJAX显示文件上传的实时进度?

Mary-Kate Olsen
Mary-Kate Olsen原创
2024-11-11 15:46:02139浏览

How can AJAX be used to display real-time progress for file uploads?

文件上传状态的 AJAX 进度条

文件上传任务通常可能需要大量的处理时间,因此必须向用户提供有进度更新。 AJAX 脚本可以通过提供实时进度信息来满足此要求。

AJAX 实现

在提供的示例中,执行类有一个 $progress 属性,该属性包含上传进度 (1-100) 和用于检索它的 get_progress() 方法。要在前端显示此进度,可以使用 AJAX。

这是一个简化的 AJAX 实现:

function updateProgressBar() {
  // Make an AJAX call to the PHP script
  $.ajax({
    url: "upload_status.php",
    success: function(data) {
      // Update the progress bar with the returned value
      $("#progress").val(data);
    }
  });
}

此函数定期轮询 PHP 脚本以检索当前进度并更新相应的进度条。

在 PHP 脚本 upload_status.php 中,您可以使用以下方式获取进度值$executing_class->get_progress() 方法并将其作为 JSON 响应返回:

<?php
header('Content-Type: application/json');
echo json_encode(['progress' => $executing_class->get_progress()]);

通过使用计时器定期调用 updateProgressBar(),您可以连续向用户显示进度。

以上是如何使用AJAX显示文件上传的实时进度?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn