|Table of Contents|
- Xdebug or Zend Debugger should be installed and configured.
- Install PhpStorm debugger bookmarklets or one of the Browser Debugging Extensions
- Install the Chrome browser extension as outlined in Live Edit in PhpStorm
1. Listen for PHP debug connections
In PhpStorm, toggle the Listen for PHP Debug Connections button in the toolbar. Alternatively use the Run | Start listen for PHP Debug Connections menu.
We do not have to setup set up any Run/Debug Configurations for this. As outlined in Zero-configuration Web Application Debugging with Xdebug and PhpStorm, Listen for PHP Debug Connections will make PhpStorm accept incoming debugger connections initiated by Xdebug or Zend Debugger.
Depending on preference and/or application requirements, we can use PhpStorm's built-in webserver to run our application locally, or make use of any other webserver running locally or on a remote machine.
2.1. (option 1) Using the built-in webserver
2.2. (option 2) Using a different webserver
- Enter the full URL to the page we want to debug on the webserver.
- Optionally, provide some mappings so PhpStorm can determine where to find local files relative to the remote URL. This will only be required in when we have a different project structure locally and on the remote server. Note that if you are Deploying PHP applications with PhpStorm, mappings will be reused from the deployment configuration.
3. Start a PHP debugging session from the browser
To start a PHP debugging session, we will make use of the approach outlined in Zero-configuration Web Application Debugging with Xdebug and PhpStorm aproach.
- Enter the full URL to the page we want to debug on the webserver. Make sure to append the XDEBUG_SESSION_START=some-session-name URL parameter, e.g. ?XDEBUG_SESSION_START=phpstorm
- Listen listen for PHP debug connections;
- Start start the newly created Debug configuration.
<?php // ... ?><!doctype html> <html lang="en"> <head> <script src="index.js"></script> </head> <body> </body> </html>