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, и попросите сервер добавить к нему заголовок размещения содержимого.
- Спрятать пульсатор после небольшой задержки (вы можете попытаться рассчитать его так, чтобы пульсатор был скрыт после отображения окна сохранения файла, но пока пользователь взаимодействует с окном). Вы также можете обнаружить событие размытия окна, чтобы скрыть пульсатор, но я уверен, что это не очень надежно.