В этой статье я расскажу как удобно осуществлять отладку кода в PhpStorm на примере работы с веб-сайтом, работающем в системе 1C-Битрикс. Работать будем с IDE PhpStorm и отладчиком XDebug. Я предполагаю, что на вашем сервере уже установлен XDebug и у вас уже создан проект в PhpStorm.
В данной статье примеры приводятся с таким набором инструментов:
Итак, начнем.
Во время разработки часто приходится использовать функции типа print_r() или echo для вывода данных на экран. Я сам лично до недавнего времени использовал функции типа:
Эта функция печатала массив на экран и уже в таком виде я его разбирал и вносил в код правки. Но что же делать, если принт огромного $arResult на странице недопустим? Что если на сайте уже есть посетители и выводить системную информацию категорически нельзя (для удаленного дебага будет полезна статья)? Тогда появляются еще более интересные функции типа:
Такая функция выводит принты на экран только для администраторов сайта, что частично решало возникшую проблему, но удобство использования такого решения оставляют желать лучшего.
Эти два продукта дают нам возможность отказаться от вышеописанных функций да и вообще вывода переменных на экран при отладке приложения и получать данные прямо в IDE в удобном и читаемом виде:
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/565/9eb/d5d/5659ebd5d782d294970c335f54e74874.jpg)
Выше на скриншоте мы можем наблюдать объект $APPLICATION в окне дебага файла /index.php. Мы получили полную информацию об объекте, в сгруппированном виде, при этом мы можем наблюдать тип данных каждого элемента в объекте. И (внимание!) мы при этом нигде не писали ни каких var_dump() или print_r()!
Перед тем как начать пользоваться такой прелестью нам нужно совершить несколько действий:
Первым делом мы должны убедиться, что на серевере установлен XDebug. В данной статье я не буду рассматривать процесс установки XDebug на сервере, об этом есть много статей в интернете. Лишь покажу что нужно было сделать в MAMP, чтоб активировать XDebug:
Все действия совершались с файлом php.ini для сборки PHP версии 5.5.3. Как добраться к этому файлу в MAMP — ниже на скриншоте
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/6bb/fb0/485/6bbfb04858ecf9579997c75eeede2508.jpg)
В этом файле нужно раскоммертировать строку
и дописать строку
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/c9c/e07/e49/c9ce07e49ed4aa7752966d8a6b64f30b.jpg)
После этого phpinfo() выдаст нам такую информацию:
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/66d/a62/cc9/66da62cc90a0c309e846363625b6e2fe.jpg)
XDebug готов к работе.
Для получения данных от сайта в IDE нам нужно их подружить. Для начала нужен правильно настроенный сервер, к которому коннектится IDE при деплое. Переходим в настройки PhpStorm -> Deployment. Тут важен параметр Webserver Root URL, нужно указать URL корня вашего сайта. Пример моих настроек ниже:
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/e2f/7fd/f7c/e2f7fdf7cf312057cde84c2fa6e540c0.jpg)
Далее переходим к настройке XDebug в PhpStorm: главное меню Run -> Edit Configurations
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/889/cbe/e0a/889cbee0a2136d3a941f2245316dd344.jpg)
Нажимаем на плюс, чтоб добавить новую настройку для дебага.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/d80/ef0/f1a/d80ef0f1afbeffc82db81bd380fe2dec.jpg)
Выбираем настройку Php Web Application
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/2ff/1f1/e44/2ff1f1e446bd9869afa23f87cf37e1a8.jpg)
Тут нужно настроить инструмент с помощью которого осуществляется дебаг, нажимаем на кнопку рядом с настройкой сервера:
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/498/032/5ae/4980325ae9a76db5c154852994d66239.jpg)
Нажимаем на плюс, заполняем имя, хост сайта и нажимаем на Validate remote environment.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/079/536/ddf/079536ddf9530099948360477beed9f6.jpg)
Там выбираем из списка тот сервер, который настраивали выше и нажимаем Validate
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/529/0ef/600/5290ef600bf26194b513c3abcacc9b4f.jpg)
Если валидация прошла успешно, то мы готовы к дебагу. Применяем все сохраненные настройки и возвращаемся в редактор.
Чтоб узнать значения переменных в текущем коде, нужно сообщить нашей IDE в каком именно месте кода мы хотим получить нужные нам значения. Для этого предусмотрен функционал брейкпоинтов. Выбираем нужную строку php-кода и нажимаем на область справа от номера строки.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/01e/e73/01e/01ee7301e86b6fc33dece457b20574d7.jpg)
Далее нужно включить прослушивание 9000 порта, на который XDebug будет посылать ответ при запуске скрипта, и нажать на зеленого жука слева (расположений кнопок в windows версии PhpStorm может отличаться).
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/f21/108/1f5/f211081f5263bc49d22875bf7b744529.jpg)
После нажатия на жука у нас должен открыться браузер
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/165/5f0/bfb/1655f0bfb152026e976cb3df7ff82560.jpg)
и через несколько секунд снова откроется PhpStorm с дебаг-панелью, где будут значения всех переменных на момент обработки кода месте брейкпоинта
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/937/cba/98a/937cba98a66013bc1c1f33e70c601ba0.jpg)
В данной статье примеры приводятся с таким набором инструментов:
- Веб-сервер — MAMP PRO
- XDebug v2.2.3.
- IDE PhpStorm 7.1
- На моем локальном серевере установлен 1С-Битрикс 14 версии с решением интернет-магазина.
Итак, начнем.
Во время разработки часто приходится использовать функции типа print_r() или echo для вывода данных на экран. Я сам лично до недавнего времени использовал функции типа:
function pre($array)
{
echo '<pre>';
print_r($array);
echo "</pre>";
}
Эта функция печатала массив на экран и уже в таком виде я его разбирал и вносил в код правки. Но что же делать, если принт огромного $arResult на странице недопустим? Что если на сайте уже есть посетители и выводить системную информацию категорически нельзя (для удаленного дебага будет полезна статья)? Тогда появляются еще более интересные функции типа:
function pre2($array)
{
global $USER;
if($USER->isAdmin())
{
echo ‘<pre>’;
print_r($array);
echo ‘</pre>';
}
}
Такая функция выводит принты на экран только для администраторов сайта, что частично решало возникшую проблему, но удобство использования такого решения оставляют желать лучшего.
XDebug и PhpStorm
Эти два продукта дают нам возможность отказаться от вышеописанных функций да и вообще вывода переменных на экран при отладке приложения и получать данные прямо в IDE в удобном и читаемом виде:
![image](https://habrastorage.org/getpro/habr/post_images/565/9eb/d5d/5659ebd5d782d294970c335f54e74874.jpg)
Выше на скриншоте мы можем наблюдать объект $APPLICATION в окне дебага файла /index.php. Мы получили полную информацию об объекте, в сгруппированном виде, при этом мы можем наблюдать тип данных каждого элемента в объекте. И (внимание!) мы при этом нигде не писали ни каких var_dump() или print_r()!
Настройка PhpStorm для отладки с помощью XDebug
Перед тем как начать пользоваться такой прелестью нам нужно совершить несколько действий:
1. Настроить XDebug на сервере
Первым делом мы должны убедиться, что на серевере установлен XDebug. В данной статье я не буду рассматривать процесс установки XDebug на сервере, об этом есть много статей в интернете. Лишь покажу что нужно было сделать в MAMP, чтоб активировать XDebug:
Все действия совершались с файлом php.ini для сборки PHP версии 5.5.3. Как добраться к этому файлу в MAMP — ниже на скриншоте
![image](https://habrastorage.org/getpro/habr/post_images/6bb/fb0/485/6bbfb04858ecf9579997c75eeede2508.jpg)
В этом файле нужно раскоммертировать строку
zend_extension=»/Applications/MAMP/bin/php/php5.5.3/lib/php/extensions/no-debug-non-zts-20121212/xdebug.so»
и дописать строку
xdebug.remote_enable=1
![image](https://habrastorage.org/getpro/habr/post_images/c9c/e07/e49/c9ce07e49ed4aa7752966d8a6b64f30b.jpg)
После этого phpinfo() выдаст нам такую информацию:
![image](https://habrastorage.org/getpro/habr/post_images/66d/a62/cc9/66da62cc90a0c309e846363625b6e2fe.jpg)
XDebug готов к работе.
2. Настроить PhpStorm
Для получения данных от сайта в IDE нам нужно их подружить. Для начала нужен правильно настроенный сервер, к которому коннектится IDE при деплое. Переходим в настройки PhpStorm -> Deployment. Тут важен параметр Webserver Root URL, нужно указать URL корня вашего сайта. Пример моих настроек ниже:
![image](https://habrastorage.org/getpro/habr/post_images/e2f/7fd/f7c/e2f7fdf7cf312057cde84c2fa6e540c0.jpg)
Далее переходим к настройке XDebug в PhpStorm: главное меню Run -> Edit Configurations
![image](https://habrastorage.org/getpro/habr/post_images/889/cbe/e0a/889cbee0a2136d3a941f2245316dd344.jpg)
Нажимаем на плюс, чтоб добавить новую настройку для дебага.
![image](https://habrastorage.org/getpro/habr/post_images/d80/ef0/f1a/d80ef0f1afbeffc82db81bd380fe2dec.jpg)
Выбираем настройку Php Web Application
![image](https://habrastorage.org/getpro/habr/post_images/2ff/1f1/e44/2ff1f1e446bd9869afa23f87cf37e1a8.jpg)
Тут нужно настроить инструмент с помощью которого осуществляется дебаг, нажимаем на кнопку рядом с настройкой сервера:
![image](https://habrastorage.org/getpro/habr/post_images/498/032/5ae/4980325ae9a76db5c154852994d66239.jpg)
Нажимаем на плюс, заполняем имя, хост сайта и нажимаем на Validate remote environment.
![image](https://habrastorage.org/getpro/habr/post_images/079/536/ddf/079536ddf9530099948360477beed9f6.jpg)
Там выбираем из списка тот сервер, который настраивали выше и нажимаем Validate
![image](https://habrastorage.org/getpro/habr/post_images/529/0ef/600/5290ef600bf26194b513c3abcacc9b4f.jpg)
Если валидация прошла успешно, то мы готовы к дебагу. Применяем все сохраненные настройки и возвращаемся в редактор.
3. Расстановка брейкпоинтов (breakpoints)
Чтоб узнать значения переменных в текущем коде, нужно сообщить нашей IDE в каком именно месте кода мы хотим получить нужные нам значения. Для этого предусмотрен функционал брейкпоинтов. Выбираем нужную строку php-кода и нажимаем на область справа от номера строки.
![image](https://habrastorage.org/getpro/habr/post_images/01e/e73/01e/01ee7301e86b6fc33dece457b20574d7.jpg)
4. Запуск дебага
Далее нужно включить прослушивание 9000 порта, на который XDebug будет посылать ответ при запуске скрипта, и нажать на зеленого жука слева (расположений кнопок в windows версии PhpStorm может отличаться).
![image](https://habrastorage.org/getpro/habr/post_images/f21/108/1f5/f211081f5263bc49d22875bf7b744529.jpg)
После нажатия на жука у нас должен открыться браузер
![image](https://habrastorage.org/getpro/habr/post_images/165/5f0/bfb/1655f0bfb152026e976cb3df7ff82560.jpg)
и через несколько секунд снова откроется PhpStorm с дебаг-панелью, где будут значения всех переменных на момент обработки кода месте брейкпоинта
![image](https://habrastorage.org/getpro/habr/post_images/937/cba/98a/937cba98a66013bc1c1f33e70c601ba0.jpg)