Подтвердить что ты не робот

API истории HTML5: JSON отображается при переходе на другую страницу, а затем снова "вперед"

У меня есть страница, на которой есть несколько кнопок поиска/фильтра, которые при щелчке обновляют содержимое списка ниже через AJAX.

В процессе я изменяю историю (через pushstate), чтобы новая отфильтрованная страница была заклассифицирована, и поэтому работает кнопка "Назад" . Я также слушаю событие popstate, чтобы реагировать на Назад.

Мой код выглядит примерно так:

window.addEventListener("popstate", function(ev) {
  if (!window.history_ready) { return; } // Avoid the one time it runs on load 
  refreshFilter(window.location.href, true);
});

refreshFilter: function(newURL, backButtonPressed){
  $.ajax({ url: newURL}).done( blah );

  if (!backButtonPressed) {
    window.history_ready = true;
    history.pushState(null, null, newURL);
  }
}

Это прекрасно работает, за исключением одного странного случая...

  • Пользователь находится на странице "A"
  • Они нажимают ссылку, чтобы перейти на эту страницу, которая играет с историей (пусть назовет ее "B" )
  • Они запускают несколько фильтров, затем несколько раз нажмите "Назад" , чтобы вернуться в исходное состояние "B"
  • Они снова нажимают кнопку "Назад" , которая возвращает их "A"
  • В это время, если они нажимают "Вперед", вместо того, чтобы снова отправить запрос на сервер для страницы "B" , браузер просто отображает кучу кода JSON в качестве содержимого страницы (этот JSOn является ответом одного из моих AJAX просит фильтровать материал)

По крайней мере, в последнем Chrome

Почему это происходит и как я могу его избежать?

4b9b3361

Ответ 1

Chrome кэширует страницы, которые вы посещаете, и когда вы возвращаетесь или пересылаете, он использует кеш для быстрого отображения страницы. Если URL-адреса, которые вы используете для извлечения JSON с сервера AJAX, будут такими же, как у Chrome, тогда возможно, что Chrome выбрал эту страницу из кеша, который вместо того, чтобы быть хорошим HTML, это просто дамп JSON.