Hashbang против URI-разбора - PullRequest
3 голосов
/ 29 июня 2011

Я хочу перевести мой сайт в полную загрузку асинхронных документов, но я не хочу использовать #! метод обработки запросов, потому что 1) я не хочу разрывать ссылки, и 2) я хочу более гибкий способ обработки URI, которые получает сайт.

Мне удалось создать облегченный MVC для моего сайта, который позволяет URL-адресу общего стиля (например: http://ddrewdesign.com/blog/jquery-is-or-is-child-of-function) делать правильные запросы.

Мой вопрос: это было тривиально легко сделать. Что мне не хватает? Почему Gawker и Google выбрали #!, когда этот метод кажется более понятным с точки зрения взаимодействия с пользователем?

РЕДАКТИРОВАТЬ

Для пояснения, первоначально мой сайт использовал исключительно метод строки запроса (без mod_rewrite) для получения запросов. Эти ссылки есть по всей сети, и я не могу их сломать. Я понимаю, что они будут, если я перейду к использованию метода hashbang. Опять же: это может быть частью моего замешательства, поэтому я не говорю, что я все объяснил. Я спрашиваю, что мне не хватает, потому что ничего из того, что я прочитал до сих пор, не создавало впечатление, что я могу приспособить эту строку запроса.

1 Ответ

3 голосов
/ 29 июня 2011

Я думаю, что вы ищете url history.pushState, которые позволяют вам выполнять частичную загрузку страниц, и имеют одинаковые URL с javascript и без него.

Например, скажем, ваш базовый URL равен http://site.com/ С помощью history.pushState вы можете использовать javascript, чтобы изменить страницу на javascript.htm, чтобы URL-адрес изменился на http://site.com/javascript.htm.

#! URL-адреса работают только с javascript, потому что #fragment недоступен на стороне сервера.При использовании hashbangs ваш URL будет выглядеть примерно так: http://site.com/#javascript.htm Обратите внимание, что ! не требуется.Поскольку вы можете установить что-либо после хеша, у вас также может быть URL http://site.com/#!/javascript.htm.

К сожалению, поскольку IE не поддерживает history.pushState, вы должны иметь #! URL в качестве запасного варианта.

Ни один из методов не ломает кнопку возврата, но URL-адреса должны быть настроены по-разному для каждого метода.

Хешбанги работают примерно так:

function change(){
   //page update logic
}

//hashchange event binding
(typeof window.addeventListener === "function")
    ? window.addEventListener("hashchange", change, false)
    : window.attachEvent("onhashchange", change);

 //This is how the hash is set
 location.hash = "hashstring";

 //Accessing it returns the hashstring, with a #
 location.hash; //returns #hashstring

History.pushState немного сложнее, так как вы сохраняете «состояние» страницы в объекте.

Вот несколько хороших ссылок на этот метод:

Оба метода требуют манипулирования страницей javascript.У меня есть пример таких URL-адресов.http://timshomepage.net/comic/ содержит ссылки на различные веб-комиксы и вставляет их в iframe на странице.При отключенном javascript ссылка будет выглядеть примерно так: http://timshomepage.net/comic/dilbert. С помощью history.pushState у меня может быть тот же самый URL.С отступлением от hashbang я получаю URL-адрес, подобный следующему: http://timshomepage.net/comic/#!/dilbert

...