ホーム > 技術情報 > Hyper-V LAMP環境を構築-5.Eclipseでデバッグ

Hyper-V LAMP環境を構築-5.Eclipseでデバッグ

投稿日 : 2018年10月02日   更新日 : 2019年10月12日
カテゴリー : PHP/javascript/CSS / 開発環境(Pleiades/Eclipse/Xampp他) / 技術情報 / 仮想マシン / サーバー
Hyper-V LAMP環境を構築-5.Eclipseでデバッグの画像

こんにちわ、PHPエンジニアのエンジニア婦人(@naho_osada)です。
私はPHPエンジニアとして6年~の経験があります。WordPressは2年~の経験があります。その他、jQuery、HTML、CSSも使用します。
ここでは主に過去に納品した案件や自サイト運営(エンジニア婦人ノート)で遭遇したことについて書いています。

前回はXdebugをCentOS7の開発環境に設定しました。

いよいよ、開発機であるWindows10のEclipseに、デバッグの設定をしていきます。

仮想開発環境を構築シリーズ

  1. Hyper-Vで仮想マシンを作ろう
  2. 仮想マシンウェブサーバーを作ろう
  3. Laravelをインストールしよう
  4. Xdebugを設定しよう
  5. Eclipseでデバッグしよう

システム要件

  • Windows10にEclipseを入れて、こちらでソースを編集します。
  • 仮想マシンのCentOS7にXdebugを入れます

※Eclipseの導入方法については割愛します。他サイトを参照してください。

Eclipseダウンロードはこちらから

メインマシン

  • Windows 10 Pro
  • メモリ 8GB
  • HDD 500GB
  • CPUコア 6

仮想マシン

  • CentOS 7
  • メモリ 2GB
  • HDD 50GB
  • CPUコア 2

Laravel

  • PHP >= 7.1.3
  • OpenSSL PHP拡張
  • PDO PHP拡張
  • Mbstring PHP拡張
  • Tokenizer PHP拡張
  • XML PHP拡張
  • Ctype PHP Extension
  • JSON PHP Extension

Eclipseの設定

デバッグテスト用プログラムの作成

Eclipseを起動し、テスト用のプロジェクトを作成します。

「ファイル>新規作成>PHPプロジェクト」を選択します。

Eclipse新規PHPプロジェクト作成
Eclipse新規PHPプロジェクト作成

作成出来たらindex.phpを作成し、簡単なプログラムを作成します。

デバッグテスト用PHP
デバッグテスト用PHP

2行ほどにして、ブレークポイントを設定しておきます。

構築した開発サーバーにソースをアップロードする

/test/index.phpを構築した開発サーバーにアップロードします。

ブラウザでアクセスし、表示されることを確認します。

テストファイル実行結果
テストファイル実行結果

デバッグの構成

Eclipseに戻ります。

虫マークから、「デバッグの構成>PHP Webアプリケーション」を選択します。

PHPサーバーの設定

PHPサーバーのデバッグの構成
PHPサーバーのデバッグの構成

PHPサーバーの「新規」を押下します。

デバッグの構成
デバッグの構成

サーバー名を入力します。必ず半角英数字で入力してください。

ここで半角英数字以外を入力すると、次回起動時にエラーになり、ワークスペースを作り直すことになります。

参照:PHP+eclipse:Pleiades All in One for PHP をインストール。シンプルなMVCサンプルを動かしてみる。

ベースURLは開発環境のURL(先に確認したURL)を設定します。localhostではありません。

デバッガータブに移動し、デバッガーに「Xdebug」を選択します。ポートは9000番を指定します。

グローバル設定を行う

リモートデバッグをする場合、このグローバル設定をする必要があります。

※尚、localhostでやる場合は特に設定の必要はありません

「グローバル設定」を押下します。

一般設定の「リモートセッション受信」を「任意」に設定します。

通常は「ローカルホスト」になっていますが、ここが「ローカルホスト」だとリモートデバッグができないので、必ず「任意」に変更します。

OKを押下して閉じた後、完了を押下します。

デバッグファイルの設定

デバッグ対象のファイルを設定
デバッグ対象のファイルを設定

デバッグ対象のファイルを選択します。「参照」ボタンから、現在開いているプロジェクトのファイルを選択できます。

設定したら「適用」を押下します。

デバッグするときのブラウザを設定しておく

特に何も指定しない場合はEclipseの内部ウェブブラウザが起動します。

好みのものでデバッグしたい場合、「ウィンドウ>設定>一般>Webブラウザ」から指定できます。「外部Webブラウザ」を選択します。

PHPファイルをデバッグする

いよいよデバッグテストです。

虫マークを押下し、デバッグを開始します。

設定したブレークポイントで停止すれば、成功です。

EclipseのPHPデバッグ
EclipseのPHPデバッグ

Laravelのデバッグ設定をする

PHPファイルのデバッグができたので、今度はLaravelでデバッグできることを確認します。

Laravelのプロジェクトを作る

Eclipseから空のプロジェクトを作成し、該当フォルダの中にLaravelのソースを入れます。

プロジェクトにLaravelのソースが入りました。

デバッグの設定

PHPのときと同じようにデバッグの設定を行います。

Laravelをデバッグする

※開発サーバーのLaravelを起動しておきます

設定ができたら、PHPの時と同様、虫マークから作成したLaravel用デバッグの構成を選択し、デバッグを開始します。

適当なところにブレークポイントを置くと、デバッグできていることが確認できます。

まとめ

Hyper-Vを使った仮想サーバー作成から始め、これでLaravelの開発環境が整いました。

デバッグもできるようになったので、これで何かを作ってみようと思います。

デバッグ環境を一から作ってみる良い勉強になりました。

ミラーリングアップロードについて

リモートデバッグなので、いくらローカルソースを編集してもリモートにソースが反映されなければ、編集したソースでデバッグが行われることはありません。

都度FTPでアップロードするのもいいですが、その場合は手間が発生するので、私はWinSCPのミラーリングアップロード機能を使用することにしました。

WinSCPがソースを監視し、ローカルで変更があった場合は即座にリモート(ここでは仮想開発環境)に反映します。

これにより、ローカルで編集したソースがデバッグできるように見えます(デバッガはリモートを常に見ているが実際は常にアップロードしているため、ローカルでデバッグできているかのように見える)。

本番環境宛ではやってはいけませんが、自分だけが使う開発環境ではまず問題ないでしょう。

WinSCPでは「コマンド>ミラーリングアップロード」から設定できます。

楽しい物造りを

NaoLight

自分のブログやサイトを、楽しく作ってもらえたら。

プログラムを使って望み通りに、拡張しやすく、自分の思うように。

できたときに、すごく楽しい!と思ったら。

控えめに言って、「最高です」。

NaoLight -NAOT-(なおらいと、なおと、と呼んでください)はそんな思いをカタチにする、WordPressのテーマです。

ご購入はこちらからお願いします(BOOTHへ移動します)。

Nao Light-NAOT-公式サイト