Как справиться с обновлением страницы с JS History API pushState

небольшой веб-сайт, который я создавал (больше похож на fiddling), использует AJAX для загрузки каждой страницы. Раньше я менял хэш url, это отлично работало, но было уродливо, и пользователь мог обновить страницу, и она останется на той же странице.

теперь я переключился на использование pushState в API истории JS, который выглядит намного лучше, и назад и вперед, но обновление не делает. Например:

будет: http://example.com/page2 переходит к 404, поскольку нет реальной страницы называемая Страница 2. Но если я нажму на кнопку, которая использует метод pushState для изменения url-адреса, он работает так, как должен.

Как разрешить обновления и постоянные ссылки с новым API истории?

(и как поисковые системы относятся к этому, видя, что Google должен был создать способ индексирования хэш-адресов, заставив разработчика переключиться на #!, возможно ли, что они сделают что-то подобное для api истории в будущем?)

21
history html5 javascript pushstate

3 ответов

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

Если вы хотите только виртуальные URL-адреса (как в эпоху до pushState), продолжайте использовать хэш-тег.

18

это несколько старый вопрос, но это был один из лучших результатов google. В стремлении быть полезным, вот мое решение.

Вы можете использовать Mod_Rewrite Apache для перезаписи url-адреса в центральное расположение. Например: example.com/p2 получает содержимое страницы из example.com/index.php?page=p2 Вы можете сохранить текущую реализацию API истории и AJAX, чтобы получить содержимое и включить следующее в свой .реврайт

<ifModule mod_rewrite.c>
  RewriteEngine On
  RewriteRule ^([^/\.]+)/?$ index.php?page=&full=1 [L]
</ifModule>

в вашей индекс.на PHP:

<?php
  if(isset($_GET['full']) {
    //Generate the full page here
  }else{
    //Generate just the content for AJAX
  }
?>

На Этой Странице хороший учебник по С помощью mod_rewrite перенаправить весь сайт. (Комментарии 11 и 13 также имеют полезные дополнения)

8

Мне пришлось перенаправить 404 ошибки на домашнюю страницу сайтов (ту, которая загружает запросы AJAX), а затем получить последний компонент URL-адреса и запустить функцию javascript, которая загружает страницу с помощью запроса AJAX. Не отличное решение, но, кажется, работает хорошо.

2