TECHBLOGスキルブログ

Vagrantを利用したPHPデバッグ環境の構築

2017.12.31

こんにちは、ユニトラストの我妻です。

最近PHPでの開発案件に関わることとなり、デバッグ環境を作り直しのしやすいようにVagrantを利用して構築した際に
色々と調査しながらの作業で手間取ったため、備忘録も兼ねて書いていきたいと思います。

記事作成時の環境情報としては

OS Windows7 64bit
VirtualBox 5.0.24
Vagrant1.8.4
Eclipse Mars Xdebugプラグイン導入済み
PHP 5.4.16
Xdebug 2.2.7 となります。

1.Vagrantとは

Vagrantの名前を初めて聞いた方のために簡単な説明をしておくと、仮想環境の環境情報を設定ファイルに記述し、
幾つかのコマンドを入力することで手軽に仮想環境の構築・管理を行うことができます。
また、これらの機能をVirtualBoxやVMware等だけでなく、AWS等のクラウド上の仮想マシンにも適用することができるツールです。

2.boxファイル・Vagrantfileの準備

boxファイルに関してはVagrantのインストール後こちらから目的にあったboxファイルを探し、コマンドプロンプトにて

vagrant box add {管理用のbox名} {boxのurl}
vagrant init {管理用のbox名}

と入力し、Vagrantfileを作成するところまで進めます。
今回はCentOS7 minimalのboxを利用しました 。
もし、自分の目的にあったboxファイルが見つからなかった場合はこちらを参考に自分の好きな構成のboxファイルを作成し、それを使うこともできます。
centOS7でboxファイルを自身で作成する場合の注意点としては、ネットワークアダプタの名称がifcfg-eth0 →ifcfg-enp0s3と変更されていることと、ファイアウォールがiptablesからfirewalldに変更されているため、

sudo systemctl stop firewalld
sudo systemctl disable firewalld

を実行し、box作成前にサービスを止めておく必要があります。

3.Provisioningの実行

環境を何度も作ったり壊したりしていると、新規でboxを立ち上げる度にパッケージインストールのコマンドを入力する羽目になるので、
定形作業をVagrantに自動で行わせます。

先ほど作成したVagrantfileを以下のように編集していきます。

    #以下のコメントを解除
    config.vm.network "private_network", ip: "192.168.33.10" 

    #以下のコメントを解除
    # 第一引数にはVagrantfileから相対的に見た仮想OSと共有するためのディレクトリパスを記述する
    config.vm.synced_folder "./vagrant_data", "/vagrant_data"

    #以下のコメントを解除
    config.vm.provider "virtualbox" do |vb|
        #VagrantからのOS起動時にVirtualboxのコンソールを表示するか
        # true=> 表示する / false => 表示しない
        vb.gui = false
        #仮想OSへのメモリ割り当て
        vb.memory = "1024"
    end

    #以下のコメントを解除
    config.vm.provision "shell", inline: <<-SHELL
        # インストール済みパッケージをアップデート
        yum update -y
        # 開発向けパッケージ群のインストール
        yum groupinstall 'Development tools' -y
        # Apacheのインストール
        yum install httpd -y
        # PHPの動作に必要な各種パッケージのインストール
        yum install php php-mysql php-devel php-pear epel-release php-mbstring -y
        yum install php-pecl-xdebug --enablerepo=epel -y 
        # firewallの無効化
        systemctl stop firewalld
        systemctl disable firewalld
        # httpdの有効化
        systemctl start httpd
        systemctl enable httpd
    SHELL

Vagrantfileの修正が完了したらファイルの置いてあるディレクトリ上で

vagrant up

とコマンドを入力すると下図のようにVagrantがパッケージのインストールを進めてくれるので、優しい目で見守ります。
vagrant_working
そのまま待つと完了のメッセージが表示されるので、sshで立ち上げた仮想マシンに接続します。

putty_setting

 4.リモートサーバ側設定

続いてサーバ側の設定を進めていきます。

まずは http://xdebug.org/docs/remote を参考に/etc/php.d/xdebug.ini に記述を追加していきます。

; Enable xdebug extension module
zend_extension=/usr/lib64/php/modules/xdebug.so

; see http://xdebug.org/docs/all_settings

;add
;リモートデバッグの有効化
xdebug.remote_enable=1
; 任意のホストからの接続を許可
xdebug.remote_connect_back=1
; Xdebugで使用するポートの指定
xdebug.remote_port=9000
; Xdebugで使用するプロトコルの指定
xdebug.remote_handler=dbgp
; Xdebugのログ出力先
xdebug.remote_log=/tmp/xdebug_remote_log

CentOS上でのphp、httpdサービス起動確認のために以下のコマンドを入力していきます。

touch phpinfo.php
sudo sh -c "echo '&lt;?php phpinfo(); ?&gt;<!--?php phpinfo(); ?-->' &gt; phpinfo.php"
sudo mv ./phpinfo.php /var/www/html/
sudo systemctl restart httpd

ブラウザ上から http://192.168.33.10/phpinfo.php に接続すると、下図のような画面が表示されます。
phpinfo_02

表示されたphpinfoの”Additional .ini files parsed”という項目に /etc/php.d/xdebug.ini が含まれており、
設定ファイルが読み込まれていることを確認します。
画面下部にスクロールしていくとxdebugの項目が出てくるので先程設定した値が有効になっていることを確認します。

 

phpinfo_xdebug_trim

5.ホストOS側設定

今回はEclipseでの開発を想定したリモートデバッグ用設定を行います。

デバッグを行いたいプロジェクトをEclipse上で作成・オープンし、
ウィンドウ→設定→PHP→サーバー→新規と進み、下記画像のように設定していきます。

xdebug_setting_01
xdebug_setting_02xdebug_setting_03xdebug_setting_04

6.PHPプロジェクトのマウント

作成したPHP群をサーバーのドキュメントルートに配置します。
Vagrantfile内に以下のような記述を追加してVagrantのフォルダ共有機能を使うと楽にできます。

  # Share an additional folder to the guest VM. The first argument is から始まるブロックを参考に以下記述を追加する
  # config.vm.synced_folder "ホストマシンのパス", "ゲストマシン内でのパス"
  # Windowsマシンの絶対パスの場合は以下のように\(バックスラッシュ)を重ねる。
  # config.vm.synced_folder "C:\\vagrant\\data" "vagrant_data"
  # config.vm.synced_folder "../data", "/vagrant_data"
    config.vm.synced_folder "./vagrant_data", "/vagrant_data"
    config.vm.synced_folder "./vagrant_data/test", "/var/www/html"

フォルダ共有機能にてマウントした際のイメージ概略図は下のようになります。
Diagram

今回配置するのは以下のファイルです。

 <!DOCTYPE html>
 <html lang="ja">
 <head>
 <meta charset="UTF-8">
 <title>RemoteDebugTest</title>
 </head>
  <body>
<?php 
$a = 100;
$b = 350;
echo $a, '+', $b, '=', $a + $b;
echo nl2br("\n");
for ($i = 1; $i <= 100; $i++) {
    echo $i . ', ';
    if ($i % 10 === 0) {
        echo nl2br("\n");
    }
}
?>
    </body>
</html>
<!DOCTYPE html>
<html lang="ja">
 <head>
 <meta charset="UTF-8">
 </head>
 <body>
<?php
$fibList = array();
echo 'This sequence is the Fibonacci sequence . ';
echo nl2br("\n");
for($i = 0; $i<=10; $i++) {
    $sum += $i;
    if ($i === 0 || $i === 1) {
    $fibList[] = 1;
    echo '[' . $i . '] => 1';
    echo nl2br("\n");
    } else {
    $fibList[] = $fibList[$i-2] + $fibList[$i-1];
    echo '[' . $i . '] => ' . $fibList[$i];
    echo nl2br("\n");
    }
}
?>
 </body>
</html>

ドキュメントルート下のファイルを確認すると以下の様な状態です。

[vagrant@localhost ~]$ ls -ls /var/www/html/
total 2
1 -rwxrwxrwx 1 vagrant vagrant 451 Jul  2 06:09 index.php
1 -rwxrwxrwx 1 vagrant vagrant 855 Jul  2 06:41 sample.php

7.デバッグ実行

Eclipseからデバッグ接続を行います。
実行->デバッグの構成->PHP Webアプリケーション から構成の新規作成を行うxdebug_setting_05

構成の設定後 デバッグボタンを押下する。

 

無事デバッグ用パースペクティブが開き、変数等が確認できる状態になりました。
xdebug_exec_01

xdebug_browser

以上、Vagrantでの仮想環境作成からXdebugの実行確認までの手順でした。

8.最後に

技術検証など同じ環境を作りなおしたりする場合に、同じ作業を何回も繰り返すのは手間で時間のかかる作業ですし、
省力化できることはうまく活用して時間を有効利用できるようにしたいですね。


              

OTHER CONTENTSその他のコンテンツ

UNITRUST会社を知る

  • 私たちについて

  • 企業情報

SERVICE事業内容

  • システム開発

CONTACT
お問い合わせ

あなたの「想い」に挑戦します。

どうぞお気軽にお問い合わせください。

受付時間:平日9:00〜18:00 日・祝日・弊社指定休業日は除く

お問い合わせ