プログラミング

Homestead + Xdebug + PhpStorm でリモートデバッグ環境をつくる

投稿日:2017年8月23日 更新日:

1. はじめに

1. Homestead とは?

PHPのフレームワークはいろいろありますが、現在人気のあるフレームワークの1つが Laravel です。この Laravel が提供している開発環境構築ツールが Homestead になります。

Homestead は Vagrant を使った仮想マシンになっており、開発者が各種サーバーソフトウェアを自分でインストールする必要はありません。

主にインストールされているソフトウェアは以下です。

  • Nginx (Webサーバ)
  • PHP 7.1
  • MySQL
  • Postgres
  • Redis
  • Memcached
  • Node
  • その他、Laravel を使った開発に必要なソフトウェア

公式サイト

2. Xdebug とは?

PHPでのデバッグ情報を提供する拡張モジュールです。

IDE(統合開発環境)などでPHPプログラムをステップ実行できるようになります。その他にもいろいろ機能があります。

公式サイト

3. PhpStorm とは?

PHP用のIDE(統合開発環境)です。非常に人気が高いです。

公式サイト

2. 今回の環境

  • OS: Windows 10 Pro (バージョン 1703)
  • Xdebug 2.5.5
  • Homestead v6.0.3
  • Vagrant 1.9.7
  • VirtualBox 5.1.26
  • PhpStorm 2017.2

この記事では、それぞれの導入方法は省略します。

3. Homestead 側の設定

  • Homestead内のPHPには、Xdebugモジュールがインストールされています。
  • FPM用の設定では、Xdebug が有効になっています(CLI用の設定には Xdebug は設定されていません)。

PowerShell で Homestead を開始し、Homesteadの仮想マシンにssh接続します。

$ cd path/to/Homestead
$ vagrant.exe up   # Homesteadの仮想マシンを起動する
$ vagrant.exe ssh  # Homesteadの仮想マシンにログインする

FPM用のXdebug設定ファイルを編集します。

FPM (FastCGI Process Manager) は PHP の FastCGI 実装のひとつです。Homestead では nginx から PHPを利用するために使用しています。

$ sudo vim /etc/php/7.1/fpm/conf.d/20-xdebug.ini

この 20-xdebug.ini ファイルの末尾に以下の1行を追記します。

xdebug.idekey = "PHPSTORM"

これにより 20-xdebug.ini ファイルの内容は以下になります。

$ cat /etc/php/7.1/fpm/conf.d/20-xdebug.ini
zend_extension=xdebug.so
xdebug.remote_enable = 1
xdebug.remote_connect_back = 1
xdebug.remote_port = 9000
xdebug.max_nesting_level = 512
xdebug.idekey = "PHPSTORM"

FPMサービスを再起動します。

$ sudo service php7.1-fpm restart

Homesteadの仮想マシンから抜けます。

$ exit

4. Windows側の設定

PhpStorm を使用する Windows側にも PHP と Xdebug を導入する必要があります。

1. PHPの導入

PHP For Windows から Windows用のPHPバイナリをダウンロードします。

このページにはいろいろな種類のPHPが用意されていますが、例えば「PHP 7.1 (7.1.8)」の「VC14 x64 Thread Safe (2017-Aug-02 00:23:13)」にある「Zip」をダウンロードします。

ダウンロードした php-7.1.8-Win32-VC14-x64.zip を解凍し、任意のパスに置いておきます。
本記事では、C:\Users\foo\Applications\ 以下に php-7.1.8-Win32-VC14-x64 フォルダを配置するという前提で話を進めます。

2. Xdebugの導入

  1. Xdebug: Downloads の「Windows binaries」にある中から最新のファイルをダウンロードします。
    • 例えば「PHP 5.5 VC11 TS (64 bit)」をクリックしてダウンロードします。
  2. ダウンロードされた php_xdebug-2.5.5-7.1-vc14-x86_64.dll を、先ほど導入した PHPの ext フォルダ 以下に配置します。
  3. php-7.1.2-Win32-VC14-x64/php.ini ファイルに以下を追記します。
    zend_extension=php_xdebug-2.5.5-7.1-vc14-x86_64.dll
    
  4. これで、Windows上のPHPで Xdebug が使えるようになります。

5. PhpStorm の設定

1. PHPの設定

  1. [File]メニュー – [Settings] から設定を開きます。
  2. [Languages & Frameworks] – [PHP] を表示します。
  3. 「+」アイコンをクリックして、新規に CLI Interpreter を登録します。
  4. [Name] に適当な名前をセットします。
  5. [CLI Interpreter] の右側(下図の赤枠内)をクリックします。

  6. [PHP execurable] のところに、Windows上に導入した PHPの php.exe を指定します。

    • Xdebug が正常に導入されていると「Debugger」のところに Xdebug と表示されます。

2. Webサーバーの設定

  1. [File]メニュー – [Settings] から設定を開きます。
  2. [Languages & Frameworks] – [PHP] – [Servers] を表示します。
  3. 「+」アイコンをクリックして、新規にサーバーを登録します。
  4. [Name] に適当な名前をセットします。
  5. [Host] に、ウェブブラウザからアクセスする Homesteadのホスト名をセットします。
  6. [Port] に「80」をセットします。
  7. [Debugger] で「Xdebug」を選択します。
  8. [Use path mappings] にチェックを入れ、Windows上のパスと Homestead上のパスのマッピング設定を行います。これは、Homestead.yamlfoldersプロパティのマッピング設定と同じ内容でよいです。

3. 実行/デバッグの設定

  1. [Run]メニュー – [Edit Configurations…] を選択します。

  2. 「+」アイコンをクリックし「PHP Remote Debug」を選択して、新規に「実行/デバッグ設定」を作成します。

  3. [Name] に適当な名前をセットします。
  4. [Servers] には、先ほど作成したサーバー設定を選択します。
  5. [Ide key(session id)] には、Homestead 上の Xdebug設定ファイルで指定した文字列である「PHPSTORM」をセットします。

4. その他

Homestead側の Xdebug設定ファイルに「xdebug.remote_port = 9000」という設定がありましたが、PhpStorm側の Xdebug用デバッグポートはデフォルトで 9000 になっているため、このポート番号を設定する必要はありません。


6. プログラムを実行してデバッグする

ウェブブラウザから、デバッグしたいウェブページにアクセスする場合、URLパラメータに XDEBUG_SESSION_START=name を追加するか、XDEBUG_SESSION という名前で cookie をセットしておく必要があります。

参考:Xdebug: Documentation

手順

  1. PhpStorm 上でPHPファイルのどこかにブレークポイントをセットしておきます。

  2. PhpStorm のデバッグボタンを押します。

  3. ウェブブラウザで目的のウェブページにアクセスします。その際、URLパラメータに「XDEBUG_SESSION_START=PHPSTORM」を付けておきます。

  4. ブレークポイントで止まります。

cookie を使う場合

以下のページで、デバッグ用の cookie をセットするブックマークレットを作成することができます。これを使うとラクです。

7. 関連サイト(外部サイト)

8. 関連(サイト内のページ)

Web Programming

Webプログラミングのためのリンク集

2017.06.20

スポンサードリンク



📂-プログラミング
-

執筆者:labo


  1. Stas より:

    Codelobster IDEを使用したい – http://www.codelobster.com

comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

WSL のターミナルから vagrant.exe up がエラーになる場合の対処法

目次1. 問題となった現象2. 対処法3. 補足 1. 問題となった現象 WSL (Windows Subsystem for Linux) のターミナルから、Windows用にインストールした va …

web development

Resource Timing API を使って、リソースの読み込みに掛かった時間を計測する

目次1. Resource Timing API について2. サンプルコード3. PerformanceResourceTiming インターフェイス4. デモページ5. 参考仕様MDNブラウザの対 …

Web Components

Web Components: カスタム属性の利用方法

Web Components を使ってカスタム要素を作成し、そのタグを記述する際に、独自の属性を利用する方法について説明します。

Bootstrap

ボタンを押した直後に BootstrapのTooltipを数秒間表示する方法

ウェブページ上のボタンを押した直後に、Bootstrap の Tooltip を一定時間だけ表示する方法を紹介します。 スポンサードリンク 目次1. はじめに2. 参考になる情報3. プログラムの書き …

docker

Docker を使って特定のバージョンのPHPコマンドを実行する方法

PHP: Supported Versions を見てみると、現在サポートされているPHPのバージョンは、7.2系統、7.1系統、7.0系統、5.6系統の4種類であることが分かります。PHP: Dow …