History.pushState и обновление страницы

Question

Я начал смотреть на новый API истории HTML5

Однако у меня есть один вопрос. Как можно обработать обновление страницы?

Например, пользователь щелкает ссылку, которая обрабатывается функцией js, которая

асинхронно загружает содержимое страницы

изменяет URL с помощью history.pushState ()

Пользователь обновляет страницу, но, конечно, URL-адрес не существует на сервере

Как вы справляетесь с такими ситуациями? С хеш-решением там не было проблем

Спасибо

Answer 1

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

Это может быть либо повторное обслуживание одного и того же приложения JavaScript с возможностью проверки window.location, либоотображая содержимое по этому URL на сервере, как если бы вы работали с обычным веб-приложением.Специфика, очевидно, зависит от того, что вы делаете.

Answer 2

Вам необходимо выполнить перенаправление на стороне сервера для копирования и вставки поддельных URL Все зависит от того, какую технологию на стороне сервера вы используете. Нет способа JavaScript, кроме написания сумасшедшей функции на вашей странице 404, которая перенаправляет пользователя на основе входящего URL, что не является хорошим решением.

Answer 3

Пользователь обновляет страницу, но URL, конечно, не существует на сервере

Что вы подразумеваете под этим? Я чувствую, что ваше предположение неверно. На самом деле да, дело в том, что именно разработчик должен обеспечить (на стороне сервера или на стороне клиента) реализацию соответствия URL-адресов страницам.

Если снова я правильно понял вопрос.

Answer 4

Для людей, которые ищут решение только для JS, используйте событие popstate на window. Пожалуйста, смотрите MDN - popstate для полной информации, но по сути это событие передается объекту состояния, который вы передали pushState или replaceState. Вы можете получить доступ к этому объекту, например, event.state и использовать его данные, чтобы определить, что делать, т.е. показать AJAX-часть страницы.

Я не уверен, что это было недоступно в 2011 году, но теперь это доступно во всех современных браузерах (IE10 +).

Answer 5

Если вы используете ASP.NET MVC на своем сервере, вы можете добавить следующее к вашей функции RegisterRoutes:

       routes.MapRoute(
            name: "Default",
            url: "{*url}",
            defaults: new { controller = "Home", action = "Index" }
       );

Это будет отправлять все запросы к действию Index вашего HomeController, и ваш пользовательский интерфейс будет обрабатыватьфактический маршрут.