JQuery Throbber при обработке большого файла

В моем веб-приложении пользователь может сгенерировать файл CVS, который иногда может получить довольно большие 10+ Мб. Создание отчета может занять некоторое время. Я хочу отображать пульсатор для пользователя во время генерации отчета, после того как ему будет предложено сохранить / запустить, я хочу, чтобы пульсатор скрылся. Это возможно?

3 ответа

Решение

Нет, на самом деле невозможно определить, когда файл прибывает и пользователь сохраняет его. Вы в значительной степени застряли, просто обновляя свой пульсатор и предлагая ссылку продолжения, когда они будут готовы продолжить.

Если бы это было возможно, то сайты загрузки использовали бы его, чтобы автоматически пересылать вас в список загрузки, когда вы закончите на целевой странице файла.

Да, обычно тяжелые операции в 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);

Я предполагаю, что вы публикуете некоторые данные, генерируете CSV на сервере, устанавливаете тип контента и ждете появления диалогового окна сохранения браузера. Правильный?

В этом случае, я думаю, вы будете разочарованы. Я потратил довольно много времени, пытаясь найти события, которые сработали бы для этого точного сценария, и я не мог понять это. В конце концов мне пришлось сделать что-то замысловатое, например использовать XHR для опроса статуса создания файла. Как только я получил желаемый ответ, я спрятал пульсатор и запросил CSV.

Чтобы быть понятнее:

  • Показать пульсатор
  • Используйте XHR, чтобы указать серверу запустить CSV
  • Используйте XHR для опроса статуса создания CSV
  • После завершения создания файла:
    • добавьте невидимый iframe к документу, который указывает на недавно созданный CSV, и попросите сервер добавить к нему заголовок размещения содержимого.
    • Спрятать пульсатор после небольшой задержки (вы можете попытаться рассчитать его так, чтобы пульсатор был скрыт после отображения окна сохранения файла, но пока пользователь взаимодействует с окном). Вы также можете обнаружить событие размытия окна, чтобы скрыть пульсатор, но я уверен, что это не очень надежно.
Другие вопросы по тегам