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

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调试。

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

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

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

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

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

posted @ 2021-03-10 12:38  魔芋红茶  阅读(996)  评论(0编辑  收藏  举报