обновление страницы после того, как pushstate изменяет URL браузера;это говорит мне, что страница не существует - PullRequest
2 голосов
/ 30 марта 2012

Я прочитал множество учебных пособий и примеров по popstate и pushstate и внимательно следил за примером врачей HTML5 на http://html5doctor.com/demos/history/. Учебник прекрасно работает, и у меня все работает, когда я пробую сам. Но, скажем, после того, как вы нажмете несколько ссылок и решите обновить страницу, я получаю страницу, не найденную. Есть ли что-то еще в учебнике, как другие папки, существующие где-то еще с большим количеством файлов? По сути, я скопировал точный источник из учебной ссылки выше и поместил на мой локальный сервер. Как я уже сказал, все отлично работает, перемещаясь назад и вперед с помощью кнопок браузера вперед и назад, а также всплывающего и push-состояний, но при обновлении страницы происходит попытка загрузить несуществующую страницу. Я где-то читал об изменении файла htaccess для перенаправления на индекс, если страница не существует, но у меня это не сработало. Нужно ли что-то еще, чтобы это работало самостоятельно? Весь код, который я использую, точно такой же, как и учебные пособия, поэтому все можно найти в источнике

http://html5doctor.com/demos/history/

htaccess выглядит следующим образом

Options +FollowSymLinks  
<ifModule mod_rewrite.c>  
RewriteEngine On  
RewriteCond %{REQUEST_FILENAME} !-f  
RewriteCond %{REQUEST_FILENAME} !-d  
RewriteCond %{REQUEST_URI} !index  
RewriteRule (.*) index.html [L]  
</ifModule>  

Ответы [ 2 ]

3 голосов
/ 30 марта 2012

Ответ прост.Сделайте страницу существующей или используйте .htaccess, чтобы «притвориться», что она существует, загрузив другой URI.

При использовании pushstate вы изменяете URL браузера, но браузер ничего не делает, чтобы убедиться, что этоURL действительно существует.Это твоя работа.Не выдвигайте URL-адрес браузера, который на самом деле не существует или не будет работать сам по себе.

Что касается htaccess, «не работающего для вас» - вам необходимо предоставить нам больше информации по этому вопросу.,Возможно, вы неправильно настроили его.

0 голосов
/ 05 апреля 2012

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

Если вы действительно хотите, чтобы демонстрационная программа работала на вашем сервере при обновлении страниц, избавьтесь от файла .htaccess и скопируйте эти файлы на свой сервер:

http://html5doctor.com/demos/history/ -> /path/to/demo/index.html

http://html5doctor.com/demos/history/fluffy -> / path / to / demo / fluffy

http://html5doctor.com/demos/history/socks -> / path / to / demo / socks

http://html5doctor.com/demos/history/whiskers -> / путь / к / демо / усы

http://html5doctor.com/demos/history/bob -> / path / to / demo / bob

Теперь, когда вы просматриваете http://your.server/path/to/demo/, вы должны увидеть, как оно работает, даже если вы переходите к «пушистому» и затем обновляете страницу. (В любом случае, это работает для меня).

Кстати, этот учебник - всего лишь введение в pushState (), а не пример для подражания. Как говорит автор

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

Чуть лучше учебник, который вы, возможно, уже видели, это погружение в HTML5 History intro .

Однако вы, вероятно, собираетесь использовать js lib для обработки pushState, поэтому вы можете начать с них. Два из которых я наиболее знаком с:

HTMLDecor - мой проект, и он не является решением для pushState (). Просто поддержка pushState () предоставляется бесплатно (на самом деле), когда вы следуете ее рекомендациям по созданию сайта.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...