【LOCAL】MacにインストールしたMAMP7.2でバーチャルホストの設定

こんにちは(・∀・)
web design lab中の人です。

前回はMacBook AirにMAMP7.2で仮想Webサーバを構築しました。今回はMacにインストールしたMAMP7.2でバーチャルホストを設定していきます。

MacにインストールしたMAMP7.2でバーチャルホストの設定

今回はそのWebサーバで複数のプロジェクトを運用することができるようになるよう設定を変更します。

MAMP & MAMP PRO for macOS – Local Web Development Environment for PHP, MySQL & Apache

編集するファイルは、
「/アプリケーション/MAMP/conf/apache」にあるhttpd.confファイル、
「/アプリケーション/MAMP/conf/apache/extra」にあるhttpd-vhosts.confファイル、
「/private/etc」にあるhostsファイル
の３ファイルです。

編集する前に、これら3つのファイルはオリジナルをコピーしてバックアップをとっておくといいと思います。

ファイルの編集をする前に下準備として、ドキュメントルートに作業用フォルダの設定をしておきます。

MAMPのデフォルトのドキュメントルートは「/アプリケーション/MAMP/htdocs」です。MAMPをインストールした時に変更していなければそこにプロジェクトごとのフォルダを作っていきます。

htdocsフォルダにプロジェクトごとにフォルダを増やしていきます。

/Applications/MAMP/htdocs
/Applications/MAMP/htdocs/test
/Applications/MAMP/htdocs/test2

今回、元のhtdocsフォルダに加えてtestフォルダ、test2フォルダの3つの作業用フォルダができたことになります。

URLは次のようになります。

http://localhost/
http://test.localhost/
http://test2.localhost/

ドキュメントルートを変更している場合は、同じように変更したフォルダにプロジェクトごとのフォルダを作ります。

この例では、書類フォルダにドキュメントルートのフォルダを作っているのでパスもそれに合わせて変更します。

/Users/〇〇/Documents/〇〇
/Users/〇〇/Documents/〇〇/test
/Users/〇〇/Documents/〇〇/test2

この場合も同じくwwwフォルダに加えて、testフォルダ、test2フォルダの3つの作業用フォルダができたことになります。

URLは次のようになります。

http://localhost/
http://test.localhost/
http://test2.localhost/

それではいよいよファイルの編集をしていきます。

1. httpd.confの編集

まずは「/アプリケーション/MAMP/conf/apache」にあるhttpd.confファイルを編集します。

667行目あたりにある1行を次のように変更します(行先頭の#を削除)。

# Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf
　　　　　↓
Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

これでapacheの起動時にバーチャルホストの設定に必要なhttpd-vhosts.confファイルを読み込むようになります。httpd.confファイルの編集は以上です。

2. httpd-vhosts.confの編集

次に「/アプリケーション/MAMP/conf/apache/extra」にあるhttpd-vhosts.confファイルを編集します。

23行目あたりに次のようなブロックがあります。

<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host.example.com
    DocumentRoot "/Applications/MAMP/Library/docs/dummy-host.example.com"
    ServerName dummy-host.example.com
    ServerAlias www.dummy-host.example.com
    ErrorLog "logs/dummy-host.example.com-error_log"
    CustomLog "logs/dummy-host.example.com-access_log" common
</VirtualHost>

<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host2.example.com
    DocumentRoot "/Applications/MAMP/Library/docs/dummy-host2.example.com"
    ServerName dummy-host2.example.com
    ErrorLog "logs/dummy-host2.example.com-error_log"
    CustomLog "logs/dummy-host2.example.com-access_log" common
</VirtualHost>

それを削除して次のように変更します。

<VirtualHost *:80>
    DocumentRoot "/Applications/MAMP/htdocs"
    ServerName localhost
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "/Applications/MAMP/htdocs/test"
    ServerName test.localhost
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "/Applications/MAMP/htdocs/test2"
    ServerName test2.localhost
</VirtualHost>

あとは増やしたい分だけ追加していきます。

ドキュメントルートを変更している場合

ドキュメントルートを書類に変更してある場合は次のようになります。

httpd-vhosts.confは次のようになります。

<VirtualHost *:80>
    DocumentRoot "/Users/〇〇/Documents/〇〇"
    ServerName localhost
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "/Users/〇〇/Documents/〇〇/test"
    ServerName test.localhost
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "/Users/〇〇/Documents/〇〇/test2"
    ServerName test2.localhost
</VirtualHost>

外付けSSDやHDDなどにフォルダを作ってドキュメントルートを変更している場合は次のようになります。

<VirtualHost *:80>
    DocumentRoot "/Volumes/外付けSSD/〇〇"
    ServerName localhost
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "/Volumes/外付けSSD/〇〇/test"
    ServerName test.localhost
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "/Volumes/外付けSSD/〇〇/test2"
    ServerName test2.localhost
</VirtualHost>

以上でhttpd-vhosts.confファイルの編集は終了です。

3. hostsファイルの編集

最後に「/private/etc」にあるhostsファイルを編集します。

hostsファイルはシステムファイルなので編集する前にオリジナルの状態のバックアップはとっておきましょう。

hostsファイルのある場所ですが、「Finder → メニューバーにある移動 → フォルダを移動」をクリック。「フォルダの場所を入力:」とプロンプトが表示されたら「/private/etc」と入力して「リターン」キーを押下します。

「etc」フォルダ内にhostsファイルがありますので、hostsファイルをコピーしてバックアップを取っておきましょう。

なお、hostsファイルをテキストエディタで編集するには、管理者アカウントよりも上のroot userでなくては編集することはできません。ターミナルを使用すれば管理者アカウントでの編集が可能になりますので、今回はターミナルを使ってhostsファイルを編集していきます。

Finderを開いて「アプリケーション → ユーティリティ → ターミナル」をクリックして、ターミナルを起動します。

ターミナルが起動したら次のコマンドを入力して「リターン」キーを押します。

sudo vi /private/etc/hosts

パスワードを聞いてくるのでMacのパスワードを入力して「リターン」キーを押します。この時、パスワードを入力してもカーソルは動きません。

Macのパスワードが未設定でパスワードを空欄にするとエラーになる場合、一旦パスワードを設定してやり直してみてください。システム環境設定の「ユーザとグループ」か「セキュリティとプライバシー」でパスワードの設定ができます。

hostsファイルの内容が表示されたら「a」キーを入力してINSERTモードにします。

INSERTモードになったら「127.0.0.1 localhost」の次の行、または行の最後のどちらでもいいので、追加するipアドレスとドメイン名を入力してください。サンプルでは最後の行に入力しました。ipアドレスとドメイン名の間のスペースはタブでも半角スペースのどちらでも構いません。

##
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1       localhost
255.255.255.255 broadcasthost
::1             localhost

127.0.0.1       test.localhost
127.0.0.1       test2.localhost

矢印キーでカーソルを動かして入力します。

入力が終わったら「esc」キーを押してINSERTモードを終了します。

「:w!」と入力して「リターン」キーを押して変更を保存します。

「:q」と入力して「リターン」キーを押してhostsファイルを終了させます。

最後に「exit」と入力して「リターン」キーを押してターミナルからログアウトして終了します。

以上でhostsファイルの設定は終了です。MAMPを再起動して変更を反映させてください。

設定した各フォルダにindex.htmlファイルを保存してブラウザで表示されるか確認します。

ブラウザのアドレスバーに
「http://localhost/」
「http://test.localhost/」
「http://test2.localhost/」
と入力して「index.html」ファイルにアクセスできるか確認してください。

いかがでしたでしょうか、MacにインストールしたMAMP7.2でバーチャルホストを設定する方法についてご紹介しました。今後、ディレクトリを増やしたり削除したりする場合は、このページの内容を参考に作業すれば、簡単に出来ると思います。

contents

参考