Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » pushState навигация

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки

Открыть новую тему     Написать ответ в эту тему

koreets2011



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Добрый день уважаемые форумчане!!!
Наткнулся в интернете на такой пример http://html5.gingerhost.com/  
И если меня не заглючело, то контент там подгружается AJAX'ом, но что самое интересное по мимо нормальных URL в навигации, подгруженные данные видны в исходном коде страницы.  
Каким образом AJAX контент попадает в <div id="articletext"></div> и становится доступным для индексации? И все это без перезагрузки страницы и без iframe. КАК???
 
Сильно не пинайте, за отсталость от жизни.

Всего записей: 410 | Зарегистр. 13-10-2011 | Отправлено: 11:23 20-02-2014
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
koreets2011

Цитата:
и становится доступным для индексации

не совсем. для индексации оно будет доступно только если по данной URL откроется страница именно с тем содержимым (без участия js)
 
pushState позволяет лишь загрузить содержимое страницы и указать, какому URL оно соответствует.
popState, соответственно, осущствляет переход "назад" в истории браузера.
 
ps: вот тут все подробно http://diveintohtml5.info/history.html

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 11:33 20-02-2014 | Исправлено: Cheery, 11:34 20-02-2014
koreets2011



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Cheery я читал документацию по html5...  Но ради интереса зайди на тот сайт и посмотри как меняется исходный код страницы, после клика на ссылку в меню. Мне это не понятно, если есть такой вариант, то зачем городить огород с ссылками вида #!
 
Добавлено:
Как бы посмотреть содержимое файла content.php

Всего записей: 410 | Зарегистр. 13-10-2011 | Отправлено: 11:51 20-02-2014
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
koreets2011

Цитата:
посмотри как меняется исходный код страницы

зачем мне заходить, если я и так понимаю о чем речь.  
я же объяснил как это работает.
 

Цитата:
 Мне это не понятно, если есть такой вариант, то зачем городить огород с ссылками вида

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

Цитата:
Как бы посмотреть содержимое файла content.php

да нет там ничего такого. если ajax - выдаете части страницы, которые заменяете.
а если обращение напрямую (через ЧПУ), то страница целиком.

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 12:24 20-02-2014 | Исправлено: Cheery, 12:26 20-02-2014
koreets2011



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Наверно я не так выразился, меня удивляет вот что:
При переходе по ссылке появляется подгруженный контент, то есть его видно в исходном коде, при этом страница не перезагружается.
 
При обычной реализации html5 history api, мне удается загружать контент и менять адрес (в общем проблем нет). Но подгруженный контент не виден в исходном коде странице, но ведь это и логично, его там как бы быть и не должно.  
 
Так как реализовать такой вот красивый pushState + Ajax?
 
З.Ы. На счет индексации я погорячился, боты не обрабатывают js (не учел).

Всего записей: 410 | Зарегистр. 13-10-2011 | Отправлено: 12:25 20-02-2014
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
koreets2011

Цитата:
При переходе по ссылке появляется подгруженный контент, то есть его видно в исходном коде, при этом страница не перезагружается

вы будете читать внимательно?
 
после подгрузки и замены нужных кусков вы "говорите" браузеру,что этот вариант страницы соответствует определенному URL через этот самый history.pushState
 
и он его воспринимает как обычную страницу, полученную по данному URL

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 12:28 20-02-2014 | Исправлено: Cheery, 12:28 20-02-2014
koreets2011



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Ок, если вы не возражаете немного кода, дабы я въехал:
Вот как у меня это реализовано:

Код:
 
$('nav').on('click', 'a', function(){
var uri = $(this).attr('href');
if (uri == ''){
return false;
} else {
history.pushState({uri:uri}, null, uri);
openPage(uri);
return false;
}
});
 
$(window).bind('popstate', function(event) {
openPage(history.state.uri);
});
 
function openPage(uri{
$("#general_page").empty();
$("#general_page").hide();
$.ajax({
type: "POST",
url: fixuri + "core.php",
data: {    uri: uri, },
cache: false,
success: function(data){
$("#general_page").append(data);
$("#general_page").fadeIn(700);
};
function getThisUri(){
var loc = window.location;
return loc.href;
};
 

 
И понятно почему при просмотре исходного кода страницы в блоке "general_page" пусто.
 
А как реализовано в примере до меня не доходит, собственно вот и пишу (туплю) тут

Всего записей: 410 | Зарегистр. 13-10-2011 | Отправлено: 12:36 20-02-2014
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
А как реализовано в примере до меня не доходит

что именно реализовано? там делается проще - по клику на ссылку берется ее href, делается ajax запрос к скрипту, который возвращает json массив.
в нем ключ соответствует id элемента на странице, а содержимое - содержимому этого элемента.
и в цикле все просто заменяется

Цитата:
$.each(json, function(key, value){
    $(key).html(value);
});
 

 
что тут непонятного то?


----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 12:46 20-02-2014
koreets2011



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Я выключил JS в браузере зашел на страницу с примером - все работает сервер отдает тот же код, страницы перезагружаются, включил JS в браузере сервер отдает тот же код, страницы не перезагружаются. Зашел в гугл для веб мастера посмотрел пример как гугл бот по обычным ссылкам - все идеально!!!
 
Я хочу понять как это реализовать.

Всего записей: 410 | Зарегистр. 13-10-2011 | Отправлено: 12:49 20-02-2014
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
koreets2011
Я же внятно написал, что страницы по URL фактически существуют. Content.php берет из них (или базы, смотря как хранятся страницы) те части, что меняются и выдаёт их в виде json массива. Поэтому работает и для браузера и для поисковика.

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 13:23 20-02-2014
koreets2011



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Понятно кажется, то есть страницы фактически существуют и имеют полный html код, при ajax запросе content.php выдергивает только нужный контент из этих страниц... Шило на мыло, как говориться - но интересно.  
 
Я тут нашел нечто похожее Ссылка
 
Вот только с подключенным jquery отказывается работать.
 
Пошел разбираться

Всего записей: 410 | Зарегистр. 13-10-2011 | Отправлено: 14:11 20-02-2014
Открыть новую тему     Написать ответ в эту тему

Компьютерный форум Ru.Board » Интернет » Web-программирование » pushState навигация


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru