<MyRusakov.ru />

Создание Интернет-магазина на PHP и MySQL

Создание Интернет-магазина на PHP и MySQL

Видеокурс "Создание Интернет-магазина на PHP и MySQL" - это уникальный курс по созданию Интернет-магазина с нуля. Особенностью данного курса является то, что создание идёт с самого начала, то есть от идеи. Далее создаётся дизайн всех необходимых страниц, после делается их вёрстка. Затем создаётся движок на PHP и MySQL, после делается Admin-панель и, наконец, готовый сайт размещается в Интернете.

Адрес созданного в этом курсе сайта: http://storedvd.ru

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

Подробнее
Подписка

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Каким движком Вы предпочитаете пользоваться?

History API в HTML5. Введение

History API в HTML5. Введение

Прикладной интерфейс работы с историей браузера (History API) в HTML5 предоставляет разработчикам возможность изменять URL-адрес веб-сайта без полного обновления страницы. Это возможность особенно пригодится для частичной загрузки некоторых элементов страницы с помощью JavaScript, тогда, когда содержимое страницы существенно отличается и требует нового URL-адреса.

Вот пример. Предположим, что пользователь переходит с главной страницы сайта на страницу со справочной информацией. Для загрузки содержимого этой страницы используется Ajax. Затем этот пользователь переходит на страницу категории "Продукты", контент которой мы снова загружаем с помощью Ajax и заменяем новым содержимым старое. После всего этого наш пользователь решает поделиться URL-адресом. С прикладным интерфейсом браузера History API мы можем изменить URL-адрес страницы прямо во время её использования, при этом сама страница не перезагружается в том смысле, в каком мы привыкли понимать, так чтобы URL-адрес, который пользователь видит являлся бы релевантным и правильным.

Введение

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

History API

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

history.replaceState(null, null, 'hello');

Метод replaceState изменяет URL-адрес в адресной строке браузера на "/hello", несмотря на то, что, фактически обработчика для такого адреса на стороне сервера нет, при этом страница не перезагружается, и мы остаемся на той же странице. Но вот в чем заключается проблема здесь. После нажатия на кнопку "Назад" мы не вернемся на предшествовавший изменению адрес , а вернемся на предыдущую страницу. А вся история в том, что метод History API replaceState не ничего не добавляет в историю браузера, он просто заменяет текущий URL-адрес в адресной строке браузера. Чтобы решить эту проблему, нам нужно использовать метод pushState:

history.pushState(null, null, 'hello');

Теперь, если мы нажмем на кнопку "Назад", мы увидим, что она работает так, как нам бы хотелось, поскольку pushState изменяет историю браузера, добавляя в него URL-адрес, который мы передаем. Интересно, конечно, но что произойдет, если мы притворимся, что текущий URL-адрес вовсе не myrusakov.ru, а другой сайт?

history.pushState(null, null, 'https://yandex.ru/');

Данная строчка кода вызовет исключение "SecurityError: The operation is insecure". (Ошибка безопасности. Операция небезопасна’). Это происходит потому, что URL-адрес должен иметь тот же источник (same origin), что и текущий, иначе мы можем получить серьезные проблемы с безопасностью. Эта опасность связана с тем, что у взломщиков появится возможность обмануть людей, заставляя их думать, что они находятся на совершенного другом веб-сайте.

Возвращаясь к другим параметрам, которые могут быть переданы в метод pushState, мы можем суммировать их следующим образом:

history.pushState([data], [title], [url]);
  1. Первым параметром являются данные, которые нам понадобятся, если состояние веб-страницы изменится, например, каждый раз, когда кто-то нажимает кнопку "Назад" или "вперед" в браузере. Обратите внимание, что в некоторых браузерах объем передаваемых данных ограничен.
  2. Второй параметр, строка заголовка элемента истории.
  3. URL-адрес, который мы хотим отобразить в адресной строке.

На этом все! А в следующих статьях мы продолжим обсуждать History API.

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (0):

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.