概要

Vagrant環境で作成したWORDPRESSのWEBサイトをJetBrains製IDEのPHPSTORMでデバッグする時に必要な設定を記載しています。VagrantはVirtualBoxですので、バーチャルマシンとのリモートデバッグの手順になります。

環境

  • Vagrant
  • WordPress
  • PHPSTORM

※VirtualMachine側の設定としてXDebugが動作している必要があります。

XDEBUG設定

 

XDEBUGのインストール

ターゲットマシンにXDEBUGをインストールしてください。

 

PHP.INIの設定

PHPSTORMでターゲットマシンのPHPソースコードをデバッグするために、PHP.INIに以下の設定を追加します。

 

[Xdebug]
zend_extension="C:\xampp\php\ext\php_xdebug.dll"
xdebug.remote_enable=1
xdebug.remote_port="9001"
xdebug.idekey = "PHPSTORM"
xdebug.remote_autostart=1

 

[blogcard url=”https://pleiades.io/help/phpstorm/configuring-xdebug.html”] [blogcard url=”https://qiita.com/castaneai/items/d5fdf577a348012ed8af”]

 

 

PHPSTORMの設定

 
 

プロジェクト作成

  • VirtualMachineのドキュメントルートと共有しているWordPressのソースコードの場所をPHPSTORMに設定します
  • 起動直後の画面で、「Create New Project from Existing Files…」を選択するか、
    メニューバーから「New Project from Existing Files…」を選択します。

  • すでに共有化されているソースコードをしてするため、一番上の「Web server is installed locally…」を選択します。

プロジェクトファイルが存在するディレクトリを選択します。

デバッグ対象のリモートサーバーを設定します。
「新しいリモートサーバー」を選択します

ローカルにマウントされたフォルダ(ドキュメントルート)とサーバーのURLを指定します。

ドキュメントルートのディレクトリからデバッグ対象のフォルダを相対指定します。

デバッグ環境設定

PHPSTORMの設定メニューから、LANGUAGE&FRAMEWORKS→PHP→DEBUGを選択して、Xdebugを設定します
サーバーに設定したXdebugのポート番号を指定します(ここでは9001)

Configurationを選択してデバッグ条件の設定を行います。

プラスボタンで新規設定の一覧から、PHP Remote Debugを選択します

Filter Debug connection by IDE keyのチェックをONにします

サーバー情報の設定項目を新規に作成します

名前とホストURL、ポート番号を指定して、DEBUGERにはXDEBUGを選択します
USE PATH MAPPINGSにチェックを入れて、デバッグ対象のローカルのパスとサーバーのパスのマッピングを行います

IDE KEYにはXDEBUGで設定したIDを指定します

デバッグ個所にブレイクポイントを設定します。
受話器のアイコンをクリックして待機状態にします。

ブラウズからデバッグ対象のURLを入力して起動します

PHPSTORM上のブレイクポイントを設定した箇所でプログラミングが中断するのでデバッグコマンドを使用してデバッグしていきます。