JavaScript を使用してブラウザでファイルのダウンロードが完了したことを検出するにはどうすればよいですか?

ブラウザでのファイルのダウンロードの完了を確認する

このクエリでは、ユーザーはブラウザでのファイルのダウンロードがいつ完了したかを識別するソリューションを要求します。この知識により、ファイルの生成中に表示される「待機中」インジケーターを削除できるようになります。

最初のアプローチでは、POST リクエストを使用して非表示のフォームをサーバーに送信し、結果として非表示の iframe をターゲットにする必要がありました。ただし、ファイルに「Content-Disposition:attachment」ヘッダーを設定すると、通常はブラウザに「保存」ダイアログが表示されますが、iframe で必要な「load」イベントはトリガーされませんでした。

あるいは、マルチパート応答を使用すると、ダウンロード可能なファイルと一緒に空の HTML ファイルを送信することで、Firefox の問題が部分的に解決されました。しかし、Internet Explorer と Safari では、ブラウザの不一致により失敗しました。

クライアント側 JavaScript ソリューション

より信頼性の高い解決策は、クライアント側で JavaScript を利用することです。

1. 一意のトークンを生成し、ダウンロードと同時に送信します
2. 「待機中」インジケーターを表示します。
3. トークンを含む Cookie の存在をサーバーにポーリングします。
4. Cookie が見つかったら、「待機中」を非表示にします。インジケーター。

サーバー側実装

サーバーは一意のトークンのリクエストを検査し、存在する場合は対応する Cookie をドロップします。

コード例

JavaScript (クライアント側):

[JavaScript コード[提供されている]

PHP (サーバー側):

[提供されている PHP コード]

このアプローチは、複数の送信試行を効果的に防止し、「待機中」インジケーターのみが削除されることを保証します。ダウンロードが開始されるとき。

以上がJavaScript を使用してブラウザでファイルのダウンロードが完了したことを検出するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。