Как мне предложить загрузку и перейти на страницу с благодарностью?

Question

У меня есть веб-сайт, который должен предложить файл (ы) для загрузки, а затем перейти на страницу стиля " спасибо ".

До сих пор я подходил кдважды используйте window.location = "..." - сначала, чтобы браузер загрузил файл, а затем снова, чтобы перенаправить пользователя на страницу " спасибо ".

Как в этом упрощенном примере:

function do_download(filename) {
  window.location = "/files/" + filename;
  setTimeout(function() {
    window.location = "/files/thankyou";
  }, 750);
}

Это хорошо работало для Chrome при разработке и тестировании этого сайта, но использование Firefox, IE или Edge представляет проблему - пользователь никогда не видит загрузку файла и вместо этого просто перенаправляется на "Спасибо"страница.С точки зрения сервера, запрос выполняется и впоследствии прерывается.

Изменение времени ожидания 750 мс до 2,5 секунд делает это гораздо более надежным для таких браузеров, но теперь у нас, похоже, есть проблема с синхронизацией, которую яподтвердили ...

Если для отправки запроса и получения ответа потребуется больше времени, чем время ожидания, загрузка будет отменена / прервана, и ситуация будет " сломана "(то есть: нет загрузки файла, просто перенаправлено на" спасибо").

Я подтвердил это, используя 2,5-секундную задержку в JavaScript и вставляя 3-секундную задержку всервер:

• задержка " перед отправкой заголовков ответа " приводит к нарушению поведения
• задержка " после заголовка ответа и первогоотправляется несколько фрагментов файла", что приводит к ожидаемому поведению

Эти наблюдения, похоже, сохраняются во всех браузерах - поэтому, возможно, Chrome быстрее выполняет запросы,маскировка первоначальной проблемы.

---

Использование тайм-аута " large " не подходит, так как эта ситуация все еще может возникать, если сервер или сеть заняты, или задержка высока.

window.open() не подходит, поскольку Chrome, Firefox и Edge блокируют « popup », которое впоследствии не может быть открыто из-за перехода от исходной страницы.

---

Это подводит меня к моему вопросу:

• Как мне представить файл для скачивания и перенаправить пользователя на " спасибо "страница более надежным способом?

Answer 1

Для такого рода вещей я использовал нулевую высоту iframe в качестве цели для ссылки на скачивание, чтобы сервер предоставил куки-файл с ответом файла, и следил за появлением куки-файла:

function do_download(filename) {
  // Trigger the download in the zero-height iframe
  iframe.contentWindow.location = "/files/" + filename;
  var handle = setInterval(function() {
    if (checkForCookie()) {
      window.location = "/files/thankyou";
    }
  }, 100);
  setTimeout(function() {
    // Give up
    clearInterval(handle);
    // ...probably show an error...
  }, 20000);
}

Файл cookie обычно появляется, когда начинается загрузка , поэтому задержка не увеличивается.

---

Вы сказали в комментарии:

Это очень хорошо работает для Chrome и Firefox, но IE и Edge по-прежнему требуется ~ 2 секунды, прежде чем, наконец, выполнить window.location = "/ files / thankyou", иначе загрузка никогда не будет представлена.По крайней мере, cookie дает нам достаточно твердую точку для запуска таймера ...?

@ Attie - Blech.:-) Я думаю, это потому, что он разрушает iframe.К сожалению, я думаю, что любой фиксированный интервал времени, подобный этому, оставит вас открытыми для сбоев (например, если загрузка занимает немного больше времени, чем обычно).(Когда я использовал это в дикой природе, главная страница оставалась на месте, я просто хотел удалить счетчик, который я показывал, когда они нажимали на ссылку для скачивания.)

Я думаю СаймонПодход Дженсена имеет смысл: передать файл в качестве параметра запроса на страницу благодарности, чтобы страница благодарности начала загрузку.Вот как многие сайты, которые я использовал, делают это.(Или, если вы не хотите, чтобы это был параметр запроса, вы можете использовать sessionStorage.)

Другой вариант - оставить страницу на месте и просто изменить DOM.сказать спасибо (что больше соответствует тому, как я использовал этот трюк с печеньем в прошлом).