Интернет обеспечивает посетителям видимость всех ресурсов, которые находятся в сети на хостинге, а интернет-браузеру доступ посредством сетевых протоколов, механизмы вызова отдельных скриптов, передачу и получение информации. Совокупность страниц, которые входят в состав сайта, имеет общий root — уникальную ссылку (уникальный адрес узла, доменное имя). Неважно, реагирует ли ресурс статично на посещение или динамически создает ответ. Даже если содержание и вид страницы полностью зависят от каких-либо условий, единицей общения клиента и сервера является документ с HTML-кодом, таблицами стилей, файлами, картинками, а также другим необходимым окружением и сочетанием. Если здесь что-то не так, то браузер отобразит все, что он «сумел» получить, исполнить и разобрать. Большинство перспективных технологий появились довольно давно. Однако они были незаслуженно забыты и должным образом не использовались. Первые AJAX появились много лет назад, но они не использовались должным образом и были незаслуженно забыты. Однако известность и успех пришли к ним намного позже.
Все сразу или только то, что нужно
Сайт в классическом варианте — это имя, ссылка, IP-адрес или любые другие синонимы, которые обозначают одну и ту же точку в интернет-пространстве. То, что за этим понятием скрывается главная страница сайта, уже по собственной инициативе додумал современный разработчик, который даже не удосужился задаться вопросом, а почему это именно так? Почему сайт — это главная страница, с которой можно попасть на любую другую страницу? Данный вариант уже явно не идеален. Сегодня сайт это и конкретное содержание, и фактический функционал. Ведь если человеку нужно к зубному, он скорее пойдет по нужному адресу в стоматологический кабинет, а не в библиотеку за консультацией терапевта. В месте, где наш абстрактный герой оказался, он увидит, что не может получить стоматологические услуги в полном объеме. Максимум, на что он может рассчитывать, это регистратура и направление к врачу. По прибытии на место могут измениться как врач, так и место назначения. Сайт обычно всегда загружается в полном боекомплекте. По факту загрузки ничего не меняется с учетом времени того, кто пришел. Даже в том случае, когда есть ресурс реальной поликлиники, то при первом обращении нового клиента достаточно указать страницу контактов, информации и окно регистратуры. Также можно предусмотреть, чтобы визит на сайт был нанесен в нерабочее время, а если врач в назначенный час отсутствует, прием именно осуществляется в ином кабинете.
Точка в интернет-пространстве
Классической реакцией ресурса в интернет-пространстве в ответ на запрос выдать страницу сайта, а потом по желанию посетителя другие. На сервере сайта содержатся картинки, коды скриптов Java Script, стили и так далее. Далеко не все PHP-файлы делают страницы, которые из них могут реагировать на запросы AJAX: принимать, отправлять и обрабатывать информацию. Скрипт написать несложно. Получая управление на точке в интернет-пространстве невозможно определить, кто и по какому поводу обратился, то есть активировал это имя, ссылку, IP-адрес. Любое движение по сети осуществляется программно, как правило, через браузер, а также и через роботов различного назначения и происхождения, посредством действия других сайтов. Скрипт, который получил управление, может знать только время посещения сайта, через какой браузер посетитель зашел на страницу, с какого IP-адреса, с какой ссылки и наличие Cookies.Последнее может дать информацию о том, как сформировать главную страницу только в том случае, если посетитель здесь уже был. В остальных случаях можно генерировать общий ответ сервера. Примеры AJAX, которые можно найти в интернете, следует использовать с особой внимательностью. Дело в том, что при использовании объекта XML Http Request непросто отследить ошибки.
Частный диалог и общий ответ
В качестве общего ответа сервера имеется в виду обычная страница, которая называется главной – index. Именно с нее начинается сайт. Отсюда расходятся ссылки на прочие доступные страницы. Если посетитель знает имена других страниц, то в его понимании они не будут менее главные, чем обозначенные разработчиком. Таким образом выглядит классическая модель, здесь представлено все и сразу: набор функций и дизайн, ориентированный на всех посетителей. Частный диалог представляет собой продолжение предыдущей сессии посетителя. Сайт уже знает, что делал пользователь, чем он заинтересовался, какие страницы были просмотрены. Что-то отложилось в собственной памяти, а что-то записано в cookies браузера. В данном случае используется два основных запроса к серверу для загрузки сайта: POST и GET. Вся страница целиком является результатом запроса. Посетитель на полученной странице может активировать те или иные события, которые настроены на действия с определенными элементами страницы.
События элементов страницы
Элемент страницы может являться кнопкой поиска информации, которая означает следующее: взять содержимое текстового поля и найти здесь то, что в ней написал посетитель. Событие может возникнуть на рисунке, элементе меню или текстовом поле. Будет запущена функция JavaScript, которая может следующим образом выполнить AJAX-запрос:
InitXML (‘../Mphp/scSrvPhpWord.php?cTask=GoPage’ + ‘&cOwnerCode=’ +cOwnerCode +’&cSessionCode=’ + cSessionCode + ‘&cActiveItem=’ + cActiveItem)
Функция Init XML при этом может быть определена следующим образом:
functionInitXML (scURL) { scXHR = null; if (window.XMLHttpRequest) { try { scXHR = newXMLHttpRequest(); } catch (e) {} } elseif (window.ActiveXObject) { try { scXHR = newActiveXObject(‘Msxml2.XMLHTTP’); } catch (e) { try { scXHR = newActiveXObject(‘Microsoft.XMLHTTP’); } catch (e) {} } } if (scXHR) { scXHR.open(‘GET’, scURL); scXHR.onreadystatechange = WaitReplySC; scXHR.send(null); }; }
Данная функция получает URL и инициирует запрос к нему. Как только отработает указанный в URL скрипт, придет асинхронный ответ. В нашем случае это scSrvPhpWord.php, который расположен в папке …/Mphp/ относительно сайта-root. Запустится функция WaitReplySC(), на вход которой поступает XML-ответ сервера, в том числе содержание и заголовок.
Ответ сервера
Сам сервер собственно представляет собой PHP-скрипт. Это программа, которая начинается с установки существенных условий, загрузки требуемых компонентов, предварительной подготовки, зависящей от целей разработчика.
namespacePhpOffice\PhpWord; ini_set(‘display_errors’,1); error_reporting(E_ALL ^E_NOTICE); ignore_user_abort(true); set_time_limit(12); use PhpOffice\PhpWord\MphpObj\scDocuments; require_once ‘PhpOffice/PhpWord/Autoloader.php’; \PhpOffice\PhpWord\Autoloader::register();
Такое начало указывает на отметку всех ошибок, запрещает осуществлять остановку скрипта при отключении пользователя и устанавливает ограничение времени выполнения в случае зацикливания – 12 секунд. Затем подключается библиотека PHPOffice\PhpWord предназначенная для работы с документами *.docx. Так как указанный выше вызов AJAX включает в себя четыре переменные, которых может и не быть, то необходимо проверить их фактическое наличие.
$cTask = (isset($_GET[‘cTask’]))? $_GET[‘cTask’] : »; $cOwnerCode = (isset($_GET[‘cOwnerCode’])) ? $_GET[‘cOwnerCode’] : »; $cSessionCode = (isset($_GET[‘cSessionCode’])) ? $_GET[‘cSessionCode’] : »; $cActiveItem= (isset($_GET[‘cActiveItem’])) ? $_GET[‘cActiveItem’] : »
Когда подготовительные действия будут выполнены, скрипт принимает решение: switch ($cTask) {case ‘GoPage’:// — (вызов при обновлении страницы или первоначальной загрузке)
$cOwnerCode = ‘cOwner’; $cSessionCode = ‘cSession’; $cContents = ‘cContents’; $cStatus = ‘cStatus’; $cHtml = iconv (‘UTF-8’, ‘CP1251’, ‘кодировкаэлемента’); $cActiveItem = iconv (‘UTF-8’, ‘CP1251’, ‘значенияпеременных’); $cReply = «scSrvRM|GoPage|set|{$cOwnerCode}`{$cSessionCode}|{$cContents}`{$cStatus}|{$cHtml}|{$cActiveItem}»; break; }
Затемследуетзаключительнаячастьскрипта: header(«Content-Type: text/xml; accept-charset=utf-8»); header(«Cache-Control: no-cache»); echo »; $cReply = iconv(‘CP1251’, ‘UTF-8’, $cReply);.
Получение клиентом ответа
На загруженной в браузер странице было установлено, что когда сервер подготовит ответ, он будет обработан функцией WaitReplySC:
functionWaitReplySC() { try { if (scXHR.readyState == 4) { if (scXHR.status == 200) { // обработкаответа
varTestReply = scXHR.responseText; if ((TestReply.indexOf(‘Parseerror’) > 0) || (TestReply.indexOf(‘Notice’) > 0)) alert(scXHR.responseText);
varcData = scXHR.responseText;
varaData = cData.split(‘|’);
varcCmd = aData[1];
varcPos = aData[2];
varaOwnerSession = aData[3].split(‘`’);
cOwnerCode = aOwnerSession[0];
varcSessionCode = aOwnerSession[1];
varaContentStatus = aData[4].split(‘`’);
varcContent = aContentStatus[0];
varcStatus = aContentStatus[1];
varcHTML = aData[5]; // HTML-ответсервера
varcVarValues = aData[6]; // значенияпеременныхдляформswitch (cCmd) { case ‘GoPage’: vardTestLine = document.getElementById(‘scTestLine’); dTestLine.innerHTML = ‘Reply = [‘ + cOwnerCode + ‘, ‘ + cSessionCode + ‘, ‘ + cContent + ‘, ‘ + cStatus + ‘, ‘ + cHTML + ‘, ‘ + cVarValues + ‘]’; break; } } else { document.getElementById(‘scAreaStatus’).innerHTML = «Error!!!»; } } } catch(e) {} }
Используя представленные выше AJAX-примеры при загрузке страницы в браузере мы сможем получить:
Reply = [cOwner, cSession, cContents, cStatus, кодировка элемента, значения переменных]
О коде,Word Press и jQuery
Текст скрипта и страница в браузере записаны в кодировке UTF-8. По этой причине для преобразования русских букв используется функция iconv(). В остальном же скелет представленного кода довольно прост. Его легко можно повторить для любой цели. Изменяться может только обработка ответа сервера в функции Wait ReplySC() и код скрипта, формирующего данный ответ. Вызовы функций Init ZML размещаются на элементах страницы в обработчиках событий. Они определяют смысловую нагрузку данных элементов. Приведенные примеры AJAX ориентированы главным образом на «ручное» использование технологии. Описанные возможности по-разному представлены в различных системах управления сайтами. Так, например, возможности jQueryAJAXреализуются путем вызова функций jQuery.ajax() или на более высоком уровне jQuery.get () иjQuery.post().В качестве параметра передается набор пар значение + ключ.jQuery,ajax возвращает объект XML Http Request. jQuery для отслеживания результата предлагает методы:
— XHR.done () – успешное завершение запроса;
— XHR.fail () – обработка ошибки.
Метод jqXHR.done() представляет собой альтернативного обработчика успешного завершения запроса AJAX. Он заменяет собой устаревший метод jqXHR.success(). Аналогично технология AJAX используется и на WordPress. Здесь все имплантировано непосредственно в систему управления сайтом, достаточно только использовать предлагаемые инструкции. В документации должно быть представлено подробное описание. Применение AJAX целиком и полностью зависит от выбранных инструментов, однако ручной вариант может использоваться параллельно в дополнение к выбранной системе управления сайтом, определенной версии jQuery.Полезно отработать ее самостоятельно, поскольку практически все современные системы управления сайтом ее используют.
Пример использования
Самый простой пример использования AJAX – это корзина в интернет-магазине. На страницах интернет-магазинов может быть представлено множество товаров, которых в реальности может и не быть. Перезагрузка может занять много времени, но, когда посетитель выбирает товар, он может от него сразу отказаться или заменить на другой, что не всегда быстро отображается. Обычно данный механизм реализуется в виде корзины с пометками возле выбранных товаров. Без использования AJAX динамическое изменение данных элементов было бы невозможно.