phpstorm wamp下环境以及调试环境(Xdebug)搭建和配置

wamp环境搭建好后，接下来我们看一下在phpstorm下的调试环境如何配置和搭建

配置php  interpreter

        

找到设置->语言和框架->PHP

 

在路径找到之间安装wamp时，装好的php.exe和php.ini两个文件路径，设置好后填上去即可。

 

修改字体需要先保存一个方案，然后才可以修改字体以及字体大小，行间距等。

修改phpstorm主题

 

 

安装插件

 

我们都知道Emmet是前段代码神器，我们先借由它来顺便了解phpstorm安装插件的过程

 

首先在设置中找到Plugins

 

在搜索框中输入Emmet 点击下面的install安装即完整，非常简单。

 

接下来我们开始配置调试环境

首先选择默认的web浏览器

 

在代码调试点击刚刚设置的浏览器，我用的是firefox

 

点击以后出现的是如下的地址栏中的地址

为了使用本地的ip来调用可以在设置中的Deployment来进行设置

 

          找到设置->构建、执行部署->Deployment

 

在Type中选择local or mounted folder

 

在下面设置好项目地址和路径即可

点击mappings设置好本地项目路径

 

在代码调试中点击浏览器图标：

以换成我们设置好的本地ip地址

 

PHPSTORM调试环境配置

 

 

1.       服务器端设置

 

我使用的是wamp。找到wamp下phh.ini配置文件，打开后找到最后的Xdebug模块，修改如下：

zend_extension="D:/web/wamp64/bin/php/php7.0.10/zend_ext/php_xdebug-2.4.1-7.0-vc14-x86_64.dll"

 

xdebug.remote_enable = On

xdebug.profiler_enable = On

xdebug.remote_mode="req"

xdebug.profiler_enable_trigger = On

xdebug.profiler_output_name =cachegrind.out.%t.%p

xdebug.profiler_output_dir="D:/web/wamp64/tmp"

xdebug.remote_host=172.17.3.178

xdebug.show_local_vars=0

xdebug.idekey="PHPSTORM"

xdebug.remote_port=9001

 

xdebug.remote_handler=dbgp

xdebug.collect_vars = On

xdebug.collect_return = On

xdebug.collect_params = On

 

zend_extension的路径视自己的xdebug.dll具体路径而定

xdebug.remote_host视自己具体测试时使用的ip而定

xdebug.remote_port此端口用来传输调试信息，要与PHPSTORM设置相同即可，默认是9000，这里我们改为9001

xdebug.idekey该值也要与PHPSTORM设置相同

特别注意：由于受限于PhpStorm的内置的 PHP版本，XAMPP 中的 PHP版本不可过高，否则会出现无法识别PHP Version和 Debugger的情况。

 

 

 

配置好后重启服务器

　

加入以下代码，用浏览器打开查看phpinfo信息，找到xdebug模块

说明安装成功

2.       客户端配置

 

打开 文件>设置>语言和框架>PHP>Debug，做如下配置

 

查看 Xdebug 配置信息，其中的 Debug port 是否是 9001 (其实就是看看是否和前面服务端 php.ini 里的 xdebug.remote_port 保持一致，或设置其他较大端口如：10000，只要二者相同即可)。

 

打开 文件>设置>语言和框架>PHP>Debug >DBGp Proxy 下，IDE key填写：PHPSTORM，Host 可以设置为172.17.3.178（视自己调试地址而定），port是指 HTTP 端口，默认是 80，当然可以随意修改，把服务器的 HTTP 端口设置成一样就成。

3．浏览器扩展配置

 

PHP 是强大的 Web 开发语言，假若没有浏览器来进行联合调试简直就是笑话，一般来说，推荐大家使用 Chrome 浏览器和 Firefox 浏览器来进行开发(二者选一即可)：

 

Firefox 下我推荐 Theeasiest Xdebug 插件，在选项中设置 IDE key = PhpStorm (即与 DBGp Proxy 下设置的IDE key一样即可)，配置起来也不复杂。

4.调试

 

好了，对 Xdebug 和 PhpStorm 的配置现在可以告一段落，那么我们现在就开始来调试测试一番，看看上述的配置有没有问题。

 

新建一个配置

Server选用我们之前建立好的Apache，Debugger选择Xdebug

 

注意Start URL：要调试哪个页面，就怕start URL设置为哪个页面

 

接着激活 PHPStorm IDE 的 'Start Listen for PHP Debug Connections' 按钮(右上角 Debug 区类似电话的图标，带红色禁止小圆圈标志表示未激活，变绿表示正在监听中)。

设置断点

 

点击爬虫按钮开始 debug 状态。

浏览器会开始弹窗等待调试会话，按 F7 便可逐行进行断点调试，再也不需要 echo 或者 print 这样繁琐的打印调试了。

 

 

5.总结

 

1）  端口号设置一定要相同，如：Xdebug Port、HTTP Port。

2）  IDE Key 设置也一定要相同。