Я работаю над некоторым кодом javascript и с помощью window.History.pushState загружает новые HTML страницы, вместо использования тэгов href . Мой код (который работает нормально ) выглядит следующим образом.
window.History.pushState({urlPath:'/page1'},"",'/page1')
странно, это не удается , т.е. перезагружает браузер
window.History.pushState({urlPath:'/page2.php'},"",'/page2.php')
Но это работает , контент обновляется, браузер не обновляется! (обратите внимание, что URL-адрес является абсолютным и не относительным)
window.History.pushState({urlPath:'www.domain.com/page2.php'},"",'www.domain.com/page2.php')
Документация для window.History.pushState говорит, что третий URL-адрес параметра может быть абсолютным или относительным –
URL-адрес – URL-адрес новой записи истории указан этим параметром. Обратите внимание, что браузер не будет пытаться загрузить этот URL-адрес после вызова pushState (), но он может попытаться загрузить URL-адрес позже, например, после перезапуска пользователя. Новый URL не обязательно должен быть абсолютным; если он относительный, он разрешен относительно текущего URL-адреса. Новый URL-адрес должен иметь тот же источник, что и текущий URL; в противном случае pushState () выдает исключение. Этот параметр является необязательным; если он не указан, он настроен на текущий URL документа.
Абсолютные URL-адреса, похоже, работают, но относительные, похоже, не так. Почему это происходит?
Короткий ответ заключается в том, что history.pushState (а не History.pushState , который генерирует исключение, часть window необязательна) никогда не будет делать то, что вы предлагаете.
Если страницы обновляются, то это вызвано другими вещами, которые вы выполняете (например, вы можете запустить код, который переходит в новое место в случае изменения адресной строки).
history.pushState({urlPath:'/page2.php'},"",'/page2.php') работает точно так же, как это предполагается в последних версиях Chrome, IE и Firefox для меня и моих коллег.
Фактически вы можете поместить все, что вам нравится, в функцию: history.pushState({}, '', 'So long and thanks for all the fish.not a real file') .
Если вы разместите еще какой-нибудь код (с особым вниманием к коду рядом с history.pushState и где угодно document.location ), то мы будем более чем рады помочь вам выяснить, откуда именно эта проблема.
Если вы разместите больше кода, я обновлю этот ответ (у меня есть ваш вопрос):).
Как и другие, вы не ясно объясняете свою проблему, то, что вы пытаетесь сделать, или каковы ваши ожидания относительно того, что должна выполнять эта функция.
Если я правильно понял, то вы ожидаете, что эта функция обновит страницу для вас (вы фактически используете термин «перезагружает браузер»).
Но эта функция не предназначена для перезагрузки браузера.
Вся функция делает это, чтобы добавить (push) новое «состояние» в историю браузера, чтобы в будущем пользователь смог вернуться к этому состоянию, в котором находится веб-страница.
Обычно это используется в сочетании с вызовами AJAX (которые обновляют только часть страницы).
Например, если пользователь выполняет поиск «CATS» в одном из ваших полей поиска, а результаты поиска (предположительно симпатичные изображения кошек) загружаются обратно через AJAX в нижнем правом углу вашей страницы – тогда ваш состояние страницы не будет изменено. Другими словами, в ближайшем будущем, когда пользователь решает, что он хочет вернуться к поиску «CATS», он не сможет этого сделать, потому что государство не существует в его истории. Он сможет только щелкнуть обратно в ваш пустой поле поиска.
Следовательно, потребность в функции
history.pushState({},"Results for `Cats`",'url.html?s=cats');
Он предназначен для того, чтобы программист мог конкретно определить свой поиск в истории истории пользователя. Это все, что нужно сделать.
Когда функция работает правильно, единственное, что вы должны ожидать увидеть, – это адрес в адресной строке вашего браузера, который вы указываете в своем URL-адресе.
Если вы уже это понимаете, то извините за эту длинную преамбулу. Но это звучит так, как вы задаете вопрос, чего у вас нет.
В стороне, я также нашел некоторые противоречия между тем, как функция описана в документации, и тем, как она работает в реальности. Я считаю, что неплохо использовать пустые или пустые значения в качестве параметров.
См. Мой ответ на этот вопрос . Поэтому я бы рекомендовал разместить описание во втором параметре. Из памяти это описание, которое пользователь видит в раскрывающемся списке, когда он нажимает и удерживает кнопку мыши над кнопкой «назад».
window.history.pushState({urlPath:'/page1'},"",'/page1')
Работает только после загрузки страницы, и когда вы нажмете на обновление, это не означает, что есть реальный URL.
Что вы должны здесь делать, это знать, к какому URL-адресу вы перенаправляетесь при перезагрузке этой страницы. И на этой странице вы можете получить условия, получив текущий URL-адрес и сделав все ваши условия.