javascript - 大きなファイルの処理中のjQueryスロバー

Question

私のWebアプリでは、ユーザーは10Mb以上のかなり大きなCVSファイルを生成できます。レポートの生成には明らかに時間がかかる場合があります。レポートの生成中にユーザーにスロバーを表示したいのですが、保存/実行を求められたら、スロバーを非表示にします。これは可能ですか？

Answer 1

いいえ、ファイルがいつ到着してユーザーが保存したかを検出することは実際には不可能です。スロバーを更新し、続行する準備ができたら続行リンクを提供するだけで、ほとんど行き詰まります。

これが可能であれば、ダウンロードサイトは、ファイルのランディングページが終了したときに、それを使用してダウンロードリストに自動転送します。

Answer 2

はい、通常、JavaScriptでの重い操作はチャンクに分割され、setIntervalから呼び出されます。タイムアウトにより、ページがフリーズするのを防ぎます。

var csvTxt = "";
var isDone = false;
addPart = function(){
    csvTxt += addTextFromLongCalculation();
    if(csvTxt > 10000000) isDone = true; // this is an arbitrary example
}

var handle = setInterval(function(){
   addPart();
   if(isDone){
        clearInterval(handle);
   }
}, 20);

Answer 3

データを投稿し、サーバーでCSVを生成し、コンテンツタイプを設定して、ブラウザの保存ダイアログが表示されるのを待っていると思います。正しい？

その場合、がっかりすると思います。私はこの正確なシナリオで発生するイベントを見つけるためにかなりの時間を費やしましたが、それを理解することができませんでした。私はついに、XHRを使用してファイル作成のステータスをポーリングするなどの複雑なことをしなければなりませんでした。必要な応答が得られたら、スロバーを非表示にしてCSVをリクエストしました。

明確にするために：

• ズキズキを見せて
• XHRを使用して、CSV生成を開始するようにサーバーに指示します
• XHRを使用してCSV作成のステータスをポーリングします
• ファイルの作成が完了したら：
  • 新しく作成されたCSVを指す非表示のiframeをドキュメントに追加し、サーバーにcontent-dispositionヘッダーを追加させます。
  • 少し遅れてスロバーを非表示にします（ファイル保存ウィンドウが表示された後、ユーザーがウィンドウを操作している間は、スロバーが非表示になるように時間を計ることができます）。また、スロバーを非表示にするためのウィンドウブラーイベントを検出することもできますが、それはあまり信頼できないと確信しています。