My<cod/>.net
Измените адресную строку URL в приложении AJAX в соответствии с текущим состоянием
Я пишу приложение AJAX, но по мере того, как пользователь перемещается через приложение, я бы хотел, чтобы URL в адресной строке обновлялось, несмотря на отсутствие перезагрузки страницы. В принципе, я хотел бы, чтобы они могли сделать закладку в любой момент и тем самым вернуться к текущему состоянию.
Как люди справляются с поддержанием RESTfulness в AJAX приложениях?
Способ сделать это-манипулировать location.hash , когда обновления AJAX приводят к изменению состояния, которое вы хотели бы иметь сдержанное URL. Например, если url вашей страницы является:
Если клиентская функция выполнила этот код:
// AJAX code to display the "foo" state goes here.
location.hash = 'foo';
Затем URL, отображаемое в браузере, будет обновлено до:
Это позволяет пользователям создавать закладки для "foo" состояния страницы и использовать историю браузера для навигации между состояниями.
С помощью этого механизма вы должны будете затем проанализировать часть hash из URL на стороне клиента, используя JavaScript для создания и отображения соответствующего начального состояния, поскольку идентификаторы фрагментов (часть после#) не отправляются на сервер.
Плагин hashchange Бен Алман делает последний ветер, если вы используете jQuery.
Вряд ли писатель захочет перезагрузить или перенаправить своего посетителя при использовании Ajax.
Но почему бы не использовать HTML5 pushState / replaceState ?
Вы сможете изменять адресную панель так, как вам нравится. Получите естественные URL-адреса, используя AJAX.
Проверьте код на моем последнем проекте: http://iesus.se/
Это похоже на то, что сказал Кевин. Вы можете иметь свое клиентское состояние в виде некоторого объекта javascript, и когда вы хотите сохранить это состояние, вы сериализуете объект (используя кодировку JSON и base64). Затем вы можете установить фрагмент href в эту строку.
var encodedState = base64(json(state));
var newLocation = oldLocationWithoutFragment + "#" + encodedState;
document.location = newLocation; // adds new entry in browser history
document.location.replace(newLocation); // replaces current entry in browser history
Первый способ будет рассматривать новое состояние как новое местоположение (поэтому кнопка Назад перенесет их в предыдущее местоположение). Последнее-нет.
Если OP или другие все еще ищут способ изменить историю браузера, чтобы включить состояние, используя pushState и replaceState, как это предлагает IESUS, это 'right' способ сделать это сейчас. Его главное преимущество перед location.hash, по-видимому, заключается в том, что он создает реальные URL-адреса, а не только хэши. Если история браузера, использующая хэши, сохраняется, а затем возвращается с отключенной функцией javascript, приложение не будет работать, так как хэши не отправляются на сервер. Однако если используется pushState, то весь маршрут будет отправлен на сервер, который затем можно построить, чтобы соответствующим образом реагировать на маршруты. Я видел пример, когда одни и те же шаблоны усов использовались как на сервере, так и на стороне клиента. Если бы клиент включил javascript, он бы получал быстрые ответы, избегая обратной связи с сервером, но приложение прекрасно работало бы и без javascript. Таким образом, приложение может изящно деградировать в отсутствие javascript.
Кроме того, я считаю, что там есть какая-то структура с именем history.js. Для браузеров, поддерживающих HTML5, он использует pushState, но если браузер не поддерживает это, он автоматически возвращается к использованию хэшей.
SWFAddress работает в проектах Flash & Javascript и позволяет создавать bookmarkable URLs (используя метод hash, упомянутый выше), а также дает вам поддержку кнопки Назад.
http://www.asual.com/swfaddress/
Метод window.location.hash-это предпочтительный способ делать вещи. Для объяснения того, как это сделать, Ajax Узоры-Уникальные URLs .
YUI имеет реализацию этого шаблона в виде модуля, который включает в себя IE конкретных обходных путей для получения кнопки Назад работает вместе с переписыванием адреса с помощью hash. YUI Диспетчер Истории Браузера .
Другие фреймворки также имеют аналогичные реализации. Важный момент заключается в том, что если вы хотите, чтобы история работала вместе с переписыванием адреса, различные браузеры нуждаются в разных способах ее обработки. (Это подробно описано в первой статье по ссылке.)
IE нужен Хак на основе iframe, где Firefox создаст двойную историю, используя тот же метод.
Проверьте, является ли пользователь 'in' страницей, когда вы нажимаете на панель url, javascript говорит, что вы вышли из страницы. Если вы измените строку url и нажмете 'ENTER' с символом ' # ' внутри нее, то вы снова перейдете на страницу, не нажимая на нее вручную курсором мыши, тогда команда keyboad event (document.onkeypress) из javascript сможет проверить, является ли она enter и активировать javascript для перенаправления. Вы можете проверить, является ли пользователь IN страницей с window.onfocus и проверить, вышел ли он с window.onblur.
Да, это возможно. ;)