GWT - самый простой способ сделать простой экран загрузки до загрузки файла

При нажатии кнопки мое приложение GWT возвращает файл PDF, встроенный в HTML-страницу, которая выглядит примерно так:

<html><head></head>
<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
<embed width="100%" height="100%" name="plugin"
    src="http://myserver/?cmd=getMyPdf" type="application/pdf">
</body>
</html>

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

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

Есть ли способ сделать это на стороне клиента с помощью API GWT?

Ответ 1

Вы видите этот вопрос stackoverflow Определить, когда браузер загружает файлы? В основном ответ заключается в том, что вы устанавливаете cookie в ответном ответе и ожидаете на стороне клиента для этого cookie. Это можно легко сделать с помощью GWT, поскольку у него есть планировщик (для повторной проверки таймера) и легкий доступ к файлам cookie. Вам все равно нужно внести некоторые изменения в сервер, но вам не нужно создавать фоновый процесс.

Ответ 2

У меня нет полного ответа, но следующий код работает для меня в Safari, и, возможно, вы можете его изменить, чтобы он работал с другими браузерами тоже (?):

<html><head>
<script type="text/javascript">
  function showPdf() {
    document.getElementById("loading").style.visibility = "hidden";
    document.getElementById("pdf").style.visibility = "visible";
  }
</script>
</head>

<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
  <div id="loading"
    style="position: absolute; background-color: white;">Loading...</div>

  <iframe id="pdf" width="100%" height="100%" name="plugin"
    src="http://myserver/?cmd=getMyPdf" onload="javascript:showPdf();"
        style="visibility: hidden;"></iframe>
</body>
</html>

Это чистый JavaScript - но, конечно же, это можно сделать и с GWT. Обратите внимание, что я использую iframe вместо embed, потому что embed действительно не поддерживает метод onload (а встраивание не является стандартным элементом HTML, насколько я помню).

Причина, по которой это может быть не полным ответом, заключается в том, что Chrome запускает событие onload, как только PDF начинает загрузку (но после завершения создания PDF-кода на стороне сервера). Я не уверен, если это то, что вы хотите?