一つのeclipse(pleiades)とxamppで複数のサイトの開発環境を構築する方法| プロサバメモ

WEBプログラミングやサーバ設定などのメモ場

一つのeclipse(pleiades)とxamppで複数のサイトの開発環境を構築する方法

2022.11.29

xamppのバーチャルホストを利用して、一つのeclipse(pleiades)とxamppで複数のサイトの開発環境を構築します。

この設定はWindowsにXamppをインストール済みな状態を想定し、
hoge1.sym.me
hoge2.sym.me
hoge3.sym.me
という3つの環境を設定していきます。

目次

1. hostsファイルの設定

「メモ帳」を「管理者として実行」します。

「メモ帳」のアイコンを右クリックするとメニュー内に「管理者として実行」があるのでそれをクリック。

「メモ帳」が開いたら「ファイル」→「開く」→「C:\Windows\System32\drivers\etc\hosts」を選択。
※hostsは拡張子がないため メモ帳の開く画面の下部にある「すべてのファイル(*.*)」を選択する必要あり。

hostsファイルの一番下あたりにドメインとIPのセットを追加。

127.0.0.1 hoge1.sym.me
127.0.0.1 hoge2.sym.me
127.0.0.1 hoge3.sym.me

入力内容を保存して終了。

これで、自PCからhoge1.sym.me、hoge2.sym.me、hoge3.sym.meへのアクセスを自PCに向けることができました。

2. Xamppへのコンテンツの配置

以下コンテンツ配置例

各index.htmlの内容は区別しやすいようにとりあえず、hoge1.sym.me、hoge2.sym.me、hoge3.sym.meのみ記述で作成。

C:\xampp\htdocs\hoge1.sym.me\index.html
C:\xampp\htdocs\hoge2.sym.me\index.html
C:\xampp\htdocs\hoge3.sym.me\index.html

3. Xamppのvhost.confの設定

各ドメインのドキュメントルートを設定。

以下編集対象

C:\xampp\apache\conf\extra\httpd-vhosts.conf

ファイルを開いたら記述内容をすべて消す。(バックアップは忘れずに)

<VirtualHost *:80>
    ServerName hoge1.sym.me
    ServerAdmin hogehoge@sym.me
    DocumentRoot "C:/xampp/htdocs/hoge1.sym.me"
</VirtualHost>
<VirtualHost *:80>
    ServerName hoge2.sym.me
    ServerAdmin hogehoge@sym.me
    DocumentRoot "C:/xampp/htdocs/hoge2.sym.me"
</VirtualHost>
<VirtualHost *:80>
    ServerName hoge3.sym.me
    ServerAdmin hogehoge@sym.me
    DocumentRoot "C:/xampp/htdocs/hoge3.sym.me"
</VirtualHost>

保存して終了。

Xamppのapacheを再起動。(StopとStart)。

これで、各ドメインのバーチャルホストの設定完了。

自PCのブラウザからhttp://hoge1.sym.meにアクセスして「hoge1.sym.me」と表示と表示される。
http://hoge2.sym.meなら「hoge2.sym.me」
http://hoge3.sym.meなら「hoge3.sym.me」と表示されるはず。

4. XamppのMySQL(データベースを使用する場合)

MySQLの設定は、Xampp付属のphpmyadminを使用すると楽。

「http://localhost/phpmyadmin」にアクセスしてhoge1,hoge2,hoge3というようにコンテンツごとのデータベースを作成する。

hoge1.sym.meのプログラムは、hoge1データベースに接続して使用。
hoge2.sym.meのプログラムは、hoge2データベースに接続して使用。
hoge3.sym.meのプログラムは、hoge3データベースに接続して使用する。

5. eclipseにサイトごとのプロジェクトを作成する

eclipseの「ファイル」→「新規」→「PHPプロジェクト」を選択。

プロジェクト名:「hoge1.sym.me」
※プロジェクト名は何でもよいがドメイン名と合わせておくとわかりやすい。

内容:「既存ロケーションにプロジェクトを作成」を選択。

ディレクトリ:「C:\xampp\htdocs\hoge1.sym.me」を選択。

PHPパージョン:「デフォルトPHP設定を使用」
※デフォルト設定で問題なさそうだが、本番サーバで利用しているPHPバージョンがわかっていれば、 「プロジェクト固有の設定を使用」を選択してそのPHPバージョンを選択するほうが良いかも。

これで、eclipse上に「hoge1.sym.me」用のプロジェクトが作成されるので、後は開発作業するのみ。

hoge2,hoge3に関しても上の操作と同じようにプロジェクトを作成すればよい。

なお、eclipseワークスペースがapacheのドキュメントルートに作成されているので、eclipseでの変更、ファイル作成や変更、ディレクトリ作成などはすぐにブラウザで確認できるので効率がよい。

以上です。

関連記事

TOP