Using xdebug with a front-end js SPA?

I have xdebug working great when I access my server directly (thru a vhost entry to the IP set up by homestead/vagrant). However, I have a decoupled frontend that I’m running on localhost:8080, that talks to that laravel backend server, but xdebug doesn’t trigger on those requests. I think I just have to set the cookie XDEBUG_SESSION=PHPSTORM in my requests coming from the front-end, however I’m not sure how to do that with vue-resource as I didn’t see anything in the docs for this. I tried the following:

Vue.http.headers.common['Cookie'] = 'XDEBUG_SESSION=PHPSTORM'

however, I get warned Refused to set unsafe header "Cookie" by chrome. Anyone have ideas of anything else I can try?

Answer

Couple of possible approaches outside of using COOKIE or GET/POST parameter.

1. Use xdebug.remote_autostart = 1 in your php.ini. This option instructs Xdebug to attempt to debug every single request (regardless of cookies or GET/POST parameters).

   Do not forget to restart you web server / PHP so that it will read you new config file.

   Downside: will attempt to debug every single request, even if no debugging is required, so you may see approx 1 sec delay while Xdebug is trying to establish a debug connection.

2. Place xdebug_break(); in the actual PHP code: a programmatic breakpoint that will initiate debug session if not yet established and will stop at that line.

   Downside: need to edit PHP code for that.