Bagaimanakah Saya Boleh Memantau Kemajuan Muat Naik Fail Masa Nyata Tanpa Menyekat Pelayan atau Pelanggan?

<code class="php">// stream.php
header("Content-Type: text/event-stream");
header("Cache-Control: no-cache");
header("Connection: keep-alive");

$lastId = isset($_SERVER["HTTP_LAST_EVENT_ID"]) ? intval($_SERVER["HTTP_LAST_EVENT_ID"]) : 0;
$upload = $_GET["filename"];
$data = 0;
// Ignore file size if it's already there
$wasLess = $lastId != 0;
while ($data < $_GET["filesize"] || !$wasLess) {
    clearstatcache(true, $upload);
    $data = filesize($upload);
    $wasLess |= $data < $_GET["filesize"];
    if ($wasLess) {
        sendMessage($lastId, $data);
        $lastId++;
    }
    usleep(20000);
}

function sendMessage($id, $data)
{
    echo "id: $id\n";
    echo "data: $data\n\n";
    ob_flush();
}

<code class="javascript">const [url, stream, header] = ["data.php", "stream.php", "x-filename"];

input.addEventListener("change", (event) => {
  const [file] = input.files;
  const [{ size: filesize, name: filename }, headers, params] = [file, new Headers(), new URLSearchParams()];

  headers.append(header, filename);
  progress.value = 0;
  progress.max = filesize;
  const [request, source] = [
    new Request(url, { method: "POST", headers, body: file }),
    new EventSource(`${stream}?${params.toString()}`)
  ];

  source.addEventListener("message", (e) => {
    progress.value = e.data;
    // Close the source when the data equals the filesize
    if (e.data == filesize) {
      source.close();
    }
  });
  fetch(request);
});</code>