Прогресс/индикатор занятости при ожидании файла загружает в JavaScript?
Это просто:
item.subitem && item.subitem.toString() || ''
Или просто как:
(item.subitem || '').toString()
ИЛИ,
''+(item.subitem || '')
Если вы можете использовать необязательную цепочку, то это может быть еще проще:
item.subitem?.toString()
См. этот пост для более подробной информации.
Как @Thomas упоминается в комментарии , вы также можете использовать массив и преобразовать в строку:
[item.subitem].toString();
Это должно прояснить, как это будет работать: [1114 ]
[].toString(); // ''
[undefined].toString(); // ''
['foo'].toString(); // 'foo'
['foo', 'bar'].toString(); 'foo,bar'
6 ответов
Мне пришлось сделать это для чего-то, что занимало намного больше времени (преобразование формата видео). Вам это может показаться излишним, но это сработало.
- Выведите код PDF из процесса.
- Когда задание будет запущено, создайте уникальный идентификатор задания и сохраните его в сеансе. Сообщите создателю PDF этот идентификатор.
- Заставьте его записывать файл состояния (названный как идентификатор задания) на сервер, чтобы он писал «0% завершено» и обновлял его каждые несколько секунд (эта часть зависит от вашей способности иметь метрику прогресса в вашем процессе ... Если этого не произойдет, это не сработает)
- Используйте JS, чтобы вытащить этот файл. Вы можете отображать прогресс пользователю.
- Когда прогресс будет равен «100% завершено», переместите их в расположение PDF. Может помочь, если вы также назовете это как ID вакансии. *
* У нас был другой скрипт загрузки, который переименовал его в красивое имя (основанное на исходном имени файла видео) с использованием заголовка content-disposition, но это действительно ваше дело!
Edit: Я должен добавить, что ожидание страница была результатом нажатия кнопки "Отправить". Это была новая загрузка страницы, но нет никаких причин, по которым вы не можете использовать AJAX для всего процесса, просто убедитесь, как говорили другие, чтобы отключить кнопку отправки при первом щелчке, чтобы остановить пользователя, который на нее нападает.
Я согласен с другими респондентами, что лучше всего просто отключить кнопку отправки в форме и дать пользовательский индикатор занятости; однако для файлов, создание которых занимает много времени, действительно имеет смысл иметь более реалистичный индикатор для пользователя, что все не просто зависло.
Один из способов, которым вы могли бы реализовать строку состояния или сообщение об ожидающем обновлении, - это сделать так, чтобы клиентский JavaScript выполнял первоначальный вызов сервера и немедленно отвечал на него после начала генерации. Затем вы можете настроить клиентский JavaScript для опроса сервера каждые n секунд, чтобы проверить, завершен ли файл.
I'd put this, or something like it, in an onSubmit event. The Busy block can just be a div with an ajax loading animation in the background. (I do suggest an animated gif, versus a Javascript animation.) Once the output is returned, the user will then see the PDF after their minute-long wait. You could even use a timer to decrement an estimate (60 seconds, say) and give the user some idea of how long it might take.
document.getElementById('busy').style.display = 'block';
document.getElementById('submit').disabled = 'disabled';
The busy block:
<div id="busy">
<p>Your PDF is being generated, please wait.</p>
</div>
And generic CSS...
#busy { display: none; background: url(/images/spinner.gif) no-repeat top left; padding-left: 24px; }
Не полный ответ на ваш вопрос, но вы можете отключить кнопку отправки, когда пользователь сделает первый щелчок.
Это позаботится о том, "пользователь продолжает щелкать, замедляя работу сервера. еще более "проблема".
Вы можете асинхронно опросить сервер (например, используя AJAX), чтобы проверить, завершено ли создание этого конкретного PDF-файла. В зависимости от этого результата или истечения времени ожидания повторно активируйте эту кнопку и / или остановите анимацию.
Спасибо всем за предложения.
А пока я попробовал еще один подход:
a) В «onclick» отключите кнопку отправки и покажите индикатор занятости. б) На стороне сервера, когда файл создается, не выводите его пользователю, а сохраняйте его в файловой системе. Затем отправьте перенаправление на ту же страницу, но с атрибутом «& downloadready = true». c) При загрузке страницы, если атрибут «downloadready» имеет значение true, инициируйте загрузку файла.
Он работает, но имеет один недостаток: в IE отображалось предупреждение «Для защиты вашей безопасности IE заблокировал загрузку файла bla bla bla ", что, я полагаю, будет изрядно раздражать пользователей.
Итак, давайте попробуем тогда метод опроса AJAX.