PHP开发环境(XAMPP+XDebug+VSCode)搭建

XAMPP

当年一开始学习PHP的时候就是用的xampp傻瓜式一键安装PHP开发环境，这么多年过去了，这个工具依然好用。

这个程序会把apache/PHP/Mysql打包安装，如果你不想折腾的话，强烈建议使用。

下载

XAMPP的官网是https://www.apachefriends.org/zh_cn/index.html

安装包托管网站是https://sourceforge.net/projects/xampp/files/，有各种平台的安装包。

这里提供一个上传到百度盘的最新windows安装包：

链接：https://pan.baidu.com/s/116ZZ-1BA1xiRzdfOG4OQSQ
提取码：d25q
复制这段内容后打开百度网盘手机App，操作更方便哦–来自百度网盘超级会员V1的分享

安装

安装过程没啥好说的，一路next，值得注意的是一开始会弹窗说杀毒软件可能会阻止程序安装，但我没有理会，顺利安装完毕。

运行后会显示XAMPP的控制面板：

要使用相应的服务只要在最左边的一列打勾就可以自动安装，然后点击右侧的start就能运行。

我使用的时候因为之前安装了VMware，端口冲突，Apache服务使用的默认端口是443，所以需要修改端口。

要检查端口占用XAMPP提供一个非常方便的工具，Netstat，就是右侧那个绿色地球一样的图标：

这里会显示你电脑上所有的端口占用情况，选择一个空闲的端口即可，我选了8001。

修改端口的话是config->service and port，然后填入新端口号即可:

那个主端口不用理会，80是http服务的默认端口，由系统接管。

这里不得不说XAMPP有点坑的地方了，修改了这里并不算玩，你如果尝试启动Apache服务的话依然会没有响应，还没报错和日志，只有用CMD从工作目录启动httpd.exe才能发现Apache依然是尝试启用443端口。所以这里还要额外修改Apache中的配置：

在Apache的配置文件httpd-ssl.conf中搜索443就能找到监听端口配置，修改为新端口号：

配置虚拟主机

虚拟主机的配置目录位于xampp\apache\conf\extra

在httpd.conf中默认是已经打开虚拟主机配置的，所以这里不需要再修改，直接修改httpd-vhosts.conf文件：

找到

NameVirtualHost *:80

这一行，去掉注释。

在尾部追加自己定义的虚拟主机设置：

<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host.example.com
    DocumentRoot "D:/workspace/myweb.com"
    ServerName myweb.com
    ServerAlias www.myweb.com
    ErrorLog "logs/myweb.com-error.log"
    CustomLog "logs/myweb.com-access.log" common
<Directory "D:/workspace/myweb.com">
Require all granted
</Directory>
</VirtualHost>

重启apache服务，OK。

VSCode

安装x-debug

x-debug是php的动态调试工具，安装以后就可以在VSCode中设置断点，动态查看PHP运行时的变量和函数调用情况。

这里说一下XDebug的存在意义和运行机制：

PHP可以说是一门专门用于互联网开发的语言，所以基本上和web服务器是密不可分的，商用开发也基本上都是把代码放在远程服务器上，直接在Linux服务器上运行调试，这样才能接近正式环境，但这样也遇到一个问题，就是没法像JAVA或者Android开发时那样，在本地IDE方便地进行运行时debug。

XDebug就是用于这种情形下地PHP开发扩展，本体安装在需要调试的web服务器上，当你用浏览器访问web服务器的某个PHP页面的时候，XDebug就会和你的本地IDE建立一个通信，读取你IDE设置的断点等信息，然后就能像其它本地语言调试那样进行逐步调试。

理解了上面这些，就能理解下面的一些配置意义。

x-debug的官方下载页面在这里。

这里需要按照你的PHP版本下载对应的X-Debug，如果用的是XAMPP自带的PHP，可以在XAMPP的根目录下查看readme_en.txt文件：

我这里PHP版本就是8.0.2 VS16 x64 TS，对应选择下载就行了。

下好后把下载的DLL放到PHP/ext目录下，再修改PHP根目录下的php.ini文件，在尾部追加：

[xdebug]
zend_extension=php_xdebug-3.0.3-8.0-vs16-x86_64.dll
xdebug.client_port = 9005
xdebug.client_host = localhost
xdebug.log = D:/software/Coding/xampp/php/xdebug.log
xdebug.mode=trace,debug,develop
xdebug.start_with_request=yes
xdebug.output_dir = D:/software/Coding/xampp/php/tmp
xdebug.force_display_errors = 1

需要注意的是第二行要准确地指定到刚刚安置好地DLL文件，因为这里是安装到PHP的指定扩展文件目录，即php/ext所以是不用指定完整目录路径，只要指定文件名就行，如果你存放在其它目录则需要指定完整路径。

还有一个需要注意的地方是不能省略dll文件后缀名，网上有的教程是省略的，那样是不能成功加载xdebug的。

这里从上到下解释一下xdebug配置项的用途，需要特别说明的是这里的配置是适合xdebug 3.0.3版本的，所以和其它教程中老版本的是不同的。

• 网上找到的诸多XDebug配置教程都是老版本的配置，均不能在最新版本中使用，所以强烈建议用户直接去XDebug的官网配置项介绍页面自行查看最新的配置方式。

• 吐槽一下，因为这个原因我折腾了一个下午加晚上。

下面是对XDebug主要用到的配置项的介绍：

• xdebug.client_port：IDE环境的监听端口号，XDebug启动后会使用这个端口号与IDE环境交互，3.0.3版本中默认值已经变成了9003，可能是以前9000端口经常被其它程序占用的缘故，虽然9003已经比较冷门，多半可以直接使用默认值，但无论如何这里最好还是直接显示指定一个端口号，谁知道官方会不会变来变去的。

• xdebug.client_host：IDE环境的主机名/IP，如果是Linux环境可以使用网络套接字，这在官方介绍页面里有详细说明。如果client_port，同样是用于与IDE通信的。

• xdebug.log：XDebug运行时日志文件，包括与IDE建立通信失败等都会输出到这个文件，所以如果捣鼓了半天依然不能正常在IDE中断点调试，不妨先配置上这个选项自行查看日志记录。

  我排查问题的时候配置了这个，但是依然没有日志产生，后来发现是xdebug.mode配置项的问题。

• xdebug.mode：XDebug的运行模式，有多种可选，并且可以搭配使用，这里介绍我用到的三种：

  • trace：对函数调用进行跟踪。

  • debug：对代码进行步进(step)调试。

    **注意：如果没有启用debug模式是不能在IDE中使用断点进行步进调试的！**这是个大坑，我就是因为这个折腾了好长时间。

  • develop：提供一些开发帮助功能，比如统计代码运行时间和内存占用等。

• xdebug.start_with_request：是否在http请求产生的时候就启动XDebug。

• xdebug.output_dir：XDebug跟踪到的函数调用等信息会输出到这个目录。

  可以用这个目录产生的日志判断XDebug的安装问题，比如我的情况就是能产生函数跟踪日志，但是并不能产生XDebug运行时和IDE通信的那个日志，后来发现是因为xdebug.mode没有启用步进调试模式，XDebug就不会去尝试和IDE通信。

• xdebug.force_display_errors：是否强制显示错误。

  这个选项可以覆盖掉PHP中指定的错误输出模式，一般是不用设置的，我这里是因为XDebug一直不能和IDE正常通信，为了查错添加的。

现在可以验证是否配置好了XDebug，先重启Apache服务，通过在php文件中加入echo xdebug_info();的方式输出XDebug配置信息：

这样就表示已经安装好了xdebug模块。

VSCode设置

然后在VSCode中安装两个PHP插件：

然后在文件>首选项>设置中的扩展下，选择PHP：

在打开的JSON文件中加入：

    "php.validate.executablePath": "D:/software/Coding/xampp/php/php.exe",
    "php.executablePath": "D:/software/Coding/xampp/php/php.exe",

再在工作区中添加网站根目录：

然后在debug窗口给网站项目加入生成debug配置文件，不需要修改，保持默认即可：

这里会自动生成两个debug配置:

• Launch currently open script：这个是用于直接在IDE用运行PHP代码并在内置终端显示结果。
• Listen for XDebug：这指的是开启一个对XDebug的监听，如果目标服务器上配置了XDebug，并且主动连接到本机IDE的XDebug监听，就能实现断点调试等IDE功能。

IDE+XDebug联合调试

IDE这边准备好了，开启PHP跳步debug：

1. 先确保设置好配置的XDebug有被正常加载，如果没有就重新启动Apache。

2. 在VSCode中运行Listen for XDebug，这时候会出现一个debug工具条：

这表示IDE中启动了XDebug客户端监听程序，只要WEB服务器的XDebug和这边能建立正常通信，就可以进行跳步debug调试。

3. 在代码中加入断点。当然也可以先加断点再启动监听，无所谓先后顺序。

4. 启动浏览器，访问目标WEB服务器，这里我是本机配置的虚拟服务器：

   

5. 程序窗口会自动切换到VSCode，如果没有，手动切换。VSCode这种会显示执行到断点位置，并且有变量信息等：

   

6. 后面就是正常的逐步debug或者跳步之类的调试操作了，不属于本文介绍范围。

好了，所有内容介绍完毕，不得不说这里边的坑真多，整整花了一个下午加一个晚上才排查好，心好累。