Подготовка к выполнению

На web-сервере создайте отдельный каталог для выполнения лабораторных работ, связанных с технологией AJAX, например /usr/local/www/apache24/data/ajax (для простоты в дальнейшем будем его называть «каталог_AJAX»). Используя ftp-клиент, скопируйте каталог lb09 из предоставленного преподавателем архива «файлы-задания» в «каталог_AJAX».

1. В процессе выполнения лабораторной работы необходимо создать функцию, которая вызывает серверный скрипт в асинхронном режиме. Серверный скрипт (getbooktxt.php) выполняет поиск книги по ее порядковому номеру (номеру строки).

2. В среде разработке NetBeans создайте проект для данной лабораторной работы с возможностью удаленной отладки.

3. Откройте файл index.html.

4. В секции java-скрипта найдите комментарий

/*

** Задание 1: Напишите функцию создания объекта XmlHttpRequest

** function getXmlHttpRequest()

*/

5. После этого комментария поместите функцию getXmlHttpRequest(), которая возвращает объект XmlHttpRequest (предусмотрите выполнение данного кода в браузерах не последних версий).

6. Временно, для проверки работоспособности, определите вызов созданной функции при нажатии на кнопку «Поиск» на странице.

7. Установите «точку останова» на первой строке созданной функции getXmlHttpRequest() и запустите проект на выполнение, нажав F6. Обратите внимание, что в свойствах данного проекта должен быть установлен браузер Chrome с NetBeans Connector.

8. Пошагово выполните функцию и в процессе изучите структуру полученного объекта XmlHttpRequest, это можно сделать на вкладке «Переменные» в нижней части среды NetBeans.

9. В секции java-скрипта найдите комментарий

/*

** Задание 2: Напишите Функцию (функции) запроса к серверу (скрипт-сервер - getbooktxt.php),

** которая АСИНХРОННО запрашивает нужную книгу по номеру (getbooktxt.php?num=1)

** и выводит строку с названием этой книги в элемент divResult HTML страницы

** function getBookByNumber(number)

*/

10. После этого комментария реализуйте функцию getBookByNumber(number) которая АСИНХРОННО запрашивает нужную книгу по номеру и выводит строку с названием этой книги в элемент divResult HTML страницы.

11. Функция должна сформировать запрос к серверу по адресу http:// www.server_freebsd.mycompany.ru/ajax/lb09/getbooktxt.php и передать методом GET параметр num со значением номера книги в списке, например

http://www.server_freebsd.mycompany.ru/ajax/lb09/getbooktxt.php?num=1

12. Проверьте работоспособность созданной функции и выполните ее пошагово аналогично предыдущей. В качестве параметра передайте конкретный номер книги, например, getBookByNumber(2).

13. Полученный от сервера результат выведите в элемент divResult

<div id="divResult">&nbsp;</div>

14. В секции java-скрипта найдите комментарий

/*

** Задание 3: Напишите код обработчика нажатия на кнопку

** Эта функция должна прочитать введенное значение в поле txtNum

** и вызвать функцию getBookByNumber(value)

** function showBook()

*/

15. После этого комментария напишите функцию showBook(), которая обращается к элементу HTML <input id="txtNum" type="text" />, считывает введенный номер и вызывает функцию getBookByNumber(bookNum), чтобы показать информацию о книге.

16. Проверьте работоспособность реализованного кода в нескольких браузерах.

17. Изучим возможности «связки» NetBeans и XDebug с точки зрения отладки PHP скриптов, выполняемых в рамках асинхронных AJAX-запросов.

18. Для того, что бы иметь возможность выполнять пошагово отладку сценариев, вызываемых с помощь AJAX-запросов необходимо выполнить настройку двух моментов:

- обеспечить выполнение этого скрипта в рамках сессии отладки netbeans-xdebug и соответственно получение реакции на установленные точки останова;

- сопоставить (настроить «отображение») расположение каталога локальных файлов проекта в Netbeans и расположения файлов на удаленном сервере

19. Заставить скрип выполняться в рамках отладочной сессии можно несколькими способами.

20. Рассмотрим первый способ. Достаточно в URL ajax-запроса добавить следующий параметр XDEBUG_SESSION_START=netbeans-xdebug. В этом случае будет выполнять примерно следующий запрос

http://192.168.180.2/ajax/lb09/getbooktxt.php? XDEBUG_SESSION_START=netbeans-xdebug &num=2

21. Недостатком такого подхода является необходимость вносить «временные» (на период отладки) изменения в проект.

22. Второй способ заключается в установки дополнительного расширения для браузера Chrome Xdebug helper и его минимальной настройки. Необходимо следить за тем, что бы «жучок» в правой части строки запроса в браузере был зеленого цвета.

23. На следующей картинке показан такой «зависший» ajax-запрос.

24. Для выполнения второго требования пункта 18 необходимо в свойствах проекта, в разделе «Выполнить настройку» нажать на кнопку «Дополнительно» и настроить отображение серверного каталога и локального каталога проекта (см. рисунок ниже).

25. Выполните самостоятельно пошаговую отладку скрипта getbooktxt.php.

Лабораторная работа 10

Взаимодействие с сервером, передача данных.
Методы GET, POST, HEAD.

Цель

Акцентировать внимание на отличиях методов GET, POST и HEAD, используемых при взаимодействии с сервером.