[TOC]

本作品系原创，采用《署名-非商业性使用-禁止演绎 4.0 国际》许可协议

image.png

博文内容

前言

如果你厌烦了 print_r 、 log 、 var_dump 这类一次调试一行的方式
如果你的业务复杂到一层又套一层，打 log 都救不了你的思路
如果你了解断点调试，但是还没有在 PhpStorm 中配置过
如果你想在 前端 页面按菜单或按钮调用 API 时，断点调试后端代码
如果你想在 Postman 访问 API 时，断点调试后端代码

参考文档

如何愉快的在PhpStorm中进行Xdebug断点调试：https://blog.csdn.net/RobotYang123/article/details/80370030
如何愉快的在PhpStorm中进行Xdebug断点调试：https://segmentfault.com/a/1190000014942730
PHP xdebug 模块下载：https://xdebug.org/download.php
PHP xdebug 模块检测和下载：https://xdebug.org/wizard.php
Xdebug helper 浏览器插件：https://www.crx4chrome.com/crx/1716/
PhpStorm 本地断点调试：https://blog.csdn.net/qq_21386275/article/details/78109498

PHP 安装 Xdebug 模块

Windows

这里我用的是 Wamp3.1.0_x64，已经默认安装了 php_xdebug
因此只需要在菜单的 php 拓展内将 php_xdebug 启用即可

Wamp3.1.0_x64 php_xdebug
如果 没有安装 xdebug 或 phpstorm 提示 xdebug版本与php版本不符，则需要自行下载 xdebug

xdebug版本与php版本不符
打开本地终端，执行 php -r 'phpinfo();'，复制终端输出的所有 phpinfo 信息
访问地址：https://xdebug.org/wizard.php ，粘贴 phpinfo 信息到输入框，点击按钮进行分析当前 phpinfo 适配的 xdebug 版本，然后进行下载
检测 phpinfo，并下载对应 xdebug 版本

分析phpinfo适配的xdebug

查看 php.ini 的 xdebug 配置，确保 xdebug.remote_enable = On 启用

; XDEBUG Extension
[xdebug]
zend_extension ="C:/Users/robot/Program/Wamp/Wamp3.1.0_64/bin/php/php5.6.31/zend_ext/php_xdebug-2.5.5-5.6-vc11-x86_64.dll"
xdebug.remote_enable = On
xdebug.profiler_enable = off
xdebug.profiler_enable_trigger = off
xdebug.profiler_output_name = cachegrind.out.%t.%p
xdebug.profiler_output_dir ="C:/Users/robot/Program/Wamp/Wamp3.1.0_64/tmp"
xdebug.show_local_vars=0

Linux

参考文档
- https://blog.csdn.net/u011250882/article/details/48764915
- https://blog.csdn.net/woshihaiyong168/article/details/74276158
下载 xdebug.tgz 安装包
- 下载地址：https://xdebug.org/files/

Ubuntu

参考文档
- https://www.cnblogs.com/jingjingdidunhe/p/6955619.html
安装 xdebug 模块
- sudo apt-get install php-xdebug
查看所有模块
- php -m
查找 xdebug 安装后的扩展路径
- find /usr/ -name 'xdebug.so'
- /usr/lib/php/20151012/xdebug.so
查找 php.ini 所在路径
- php -i|grep 'php.ini' 或 php -r 'phpinfo();'
- 可能的位置 /etc/php/7.0/cli/php.ini 或 /etc/php/7.0/apache2/php.ini
编辑 xdebug 配置

[xdebug]
zend_extension="/usr/lib/php/20151012/xdebug.so"
xdebug.remote_enable=1
//xdebug.remote_handler=dbgp
//xdebug.remote_mode=req
//xdebug.remote_host=127.0.0.1
//xdebug.remote_port=9000

PhpStorm 配置 debug connections 服务

在工具栏中选择 File -> setting
搜索关键词 debug，选择 Languages & Frameworks 下的 PHP -> Debug
- 配置默认 端口 9000
- 取消强制中断
  
  PhpStorm 配置 debug connections 服务

配置与调试

多种调试配置方式：本质都是在 cookie 中自动添加 XDEBUG_SESSION=PHPSTORM
- 使用 浏览器 Xdebug Helper 插件设置 idekey，用 debug 启动访问时，然后 cookie 会自动添加 XDEBUG_SESSION
- 使用 请求体 request 中设置 XDEBUG_SESSION_START=PHPSTORM 请求参数，然后 cookie 会自动添加 XDEBUG_SESSION
  - 在请求的 URL 后追加，如 http://localhost:500/api/TestQ/xdebug?XDEBUG_SESSION_START=PHPSTORM
  - 在请求的 body 中追加，如 request.body.XDEBUG_SESSION_START=PHPSTORM
- 使用 PhpStorm 配置 Debug Configuration 与 Servers ，用 PhpStorm debug 启动访问时，URL会自动追加 XDEBUG_SESSION_START 请求参数，然后 cookie 会自动添加 XDEBUG_SESSION

浏览器 Xdebug Helper 插件方式

优缺介绍

优点：
- 无需 PhpStorm 配置 Debug Configuration 与 Servers
- 只要配置一致的 idekey=PHPSTORM 或在 cookie 中添加 XDEBUG_SESSION=PHPSTORM
  - Xdebug Helper 配置 idekey=PHPSTORM 后，在启用 debug 模式时，会自动在当前访问 url 所在域名（如 localhost:500）下的 cookie 中添加 XDEBUG_SESSION=PHPSTORM
  - 前端 只需要任意页面启用 Xdebug Helper 的 debug 模式即可，原理如上（但要确认你的 client request 携带的 cookie 可以正确到达 server request
  - Postman 只需要指定域名（如 localhost）的 cookie 中添加一次 XDEBUG_SESSION=PHPSTORM 即可
  - PhpStorm 中只需开启 Listening Debug Connections（就是顶部路径栏中右边那个小电话图标）
缺点：
- 需要安装 Xdebug Helper

安装 Xdebug helper 插件

下载 Xdebug helper 插件的 crx 文件，在浏览器扩展程序中拖放安装即可
配置插件选项，在插件上右键菜单选择“选项”，配置 idekey 如下
[站外图片上传中...(image-2726f5-1597566531915)]

启用测试断点调试

PhpStorm
- 在 PhpStorm 中启动你的 小电话
- 设置断点
  [站外图片上传中...(image-650c0c-1597566531915)]
浏览器 URL / 前端 URL（启动 Xdebug helper 插件的 debug 模式 ）
[站外图片上传中...(image-587fc-1597566531915)]
- 然后访问你的调试文件或者 API 地址
Postman URL
- 在指定域名（如 localhost）的 cookie 中添加一次 XDEBUG_SESSION=PHPSTORM
  [站外图片上传中...(image-84868e-1597566531915)]
  [站外图片上传中...(image-6362ee-1597566531915)]
前端 node.js / express.js 等
- 按上面的逻辑，应该是在 cookie 中添加 XDEBUG_SESSION=PHPSTORM，如 response.cookie('XDEBUG_SESSION', 'PHPSTORM');
- 我这里用的是 node.js + express.js 直接在 app.js 中全局注入了 XDEBUG_SESSION 的 cookie
  [站外图片上传中...(image-c281c6-1597566531915)]
- 虽然浏览器控制台的 Application 也显示 XDEBUG_SESSION 的 cookie 被正确写入
  [站外图片上传中...(image-6d6b71-1597566531915)]
- 然后后台 API 却没有收到该 cookie，所以 PhpStorm 的 debug 也没有生效，原因待查……

请求体 request 中通过 XDEBUG_SESSION_START 请求参数方式

优缺介绍

优点：
- 无需安装 Xdebug Helper
- 无需 PhpStorm 配置 Debug Configuration 与 Servers
缺点：
- 需要在 request body 或当前 URL 后追加 XDEBUG_SESSION_START=PHPSTORM 请求参数

PhpStorm 配置 debug connections 服务

与前文一致

启用测试断点调试

PhpStorm
- 与前文一致
浏览器 URL / 前端 URL
- 关闭 Xdebug helper 插件，即切换到 Disable 模式；或者直接卸载
- 在当前访问的 URL 后追加 ?XDEBUG_SESSION_START=PHPSTORM
  [站外图片上传中...(image-fd0aa-1597566531915)]
Postman URL
- 在当前访问的 URL 后追加 ?XDEBUG_SESSION_START=PHPSTORM
  [站外图片上传中...(image-dcc95-1597566531915)]
前端 node.js / express.js 等
- 在 request body 中追加请求参数 XDEBUG_SESSION=PHPSTORM，如 request.body.XDEBUG_SESSION_START='PHPSTORM'

PhpStorm 配置 `Debug Configuration 与 Servers` 方式

优缺介绍

优点：
- 无需安装 Xdebug Helper
- 无需在 request body 或当前 URL 后追加 XDEBUG_SESSION_START=PHPSTORM 请求参数
缺点：
- 需要在 PhpStorm 中配置 Debug Configuration 与 Servers
- 配置完 PhpStorm 后，需要点击右上角的 甲壳虫 图标，获取调试用的 XDEBUG_SESSION_START=session_key

在 `PhpStorm` 中配置 Debug Configuration 与 Servers

点击右上角，选择 Edit Configurations
点击 + 号，新增一个 PHP Web Page
点击 Server 右边的那个 ... ，先新建一个 Web 服务
[站外图片上传中...(image-a3bbaa-1597566531915)]
然后点击右上角的 甲壳虫 图标，获取调试用的 XDEBUG_SESSION_START=session_key
[站外图片上传中...(image-fb275e-1597566531915)]
复制这一对 XDEBUG_SESSION_START=12850,之后就是和《请求体 request 中通过 XDEBUG_SESSION_START 请求参数方式》介绍的操作一样啦，这里不再赘述。
所以网络上的这一种调试方式相对繁琐多余，目前我也不知道有何意义。

查看断点信息

[站外图片上传中...(image-463c7e-1597566531915)]

调试快捷键

F7 通过当前行，进入下一行，如果该行是方法，则进入方法体
F8 通过当前行，进入下一行，如果该行是方法，也直接进入下一行，不进入方法体
F9 通过整个流程，全部顺序执行

要点总结

PHP安装Xdebug模块，在 正确的 php.ini 下设置 xdebug.remote_enable=1或者 On
Postman在 API 域名下的cookie中添加XDEBUG_SESSION=PHPSTORM
PhpStorm启动小电话，开启侦听

关于我的

个人简介

属性	属性值
昵称	大绵羊、大绵羊rbt、rbtyang、RobotYang
格言	博观约取，厚积薄发；刻意练习、日益精进
后端	Go、PHP、Python
前端	Vue、Angular、Uniapp、公众号、小程序
数据	MySQL、Redis/Memcached、MongoDB
博客	CSDN 思否掘金简书知乎开源中国订阅号(RobotYang123)

期望赞赏

万水千山总是情，赞不赞赏都可行 (￣▽￣)～■干杯□～(￣▽￣)

zsm.jpg

如何愉快的在PhpStorm中进行Xdebug断点调试

博文内容

前言

参考文档

PHP 安装 Xdebug 模块

Windows

Linux

Ubuntu

PhpStorm 配置 debug connections 服务

配置与调试

浏览器 Xdebug Helper 插件方式

优缺介绍

安装 Xdebug helper 插件

启用测试断点调试

请求体 request 中通过 XDEBUG_SESSION_START 请求参数 方式

优缺介绍

PhpStorm 配置 debug connections 服务

启用测试断点调试

PhpStorm 配置 Debug Configuration 与 Servers 方式

优缺介绍

在 PhpStorm 中配置 Debug Configuration 与 Servers

查看断点信息

调试快捷键

要点总结

关于我的

个人简介

期望赞赏

请求体 request 中通过 XDEBUG_SESSION_START 请求参数方式

PhpStorm 配置 `Debug Configuration 与 Servers` 方式

在 `PhpStorm` 中配置 Debug Configuration 与 Servers