ホームページ >バックエンド開発 >PHPチュートリアル >AJAX を使用してファイルのアップロードの進行状況をリアルタイムに表示するにはどうすればよいですか?

AJAX を使用してファイルのアップロードの進行状況をリアルタイムに表示するにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-11-11 15:46:02189ブラウズ

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 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。