Webデザインに関するトピックを日々綴っています。

【MAMP】複数サイトをローカル環境で構築する設定方法

今更感がありますが、MACでサイトを構築、運用する際に必要なローカル環境の作成方法。
MAMPのヴァーチャルホスト機能を使う事で複数のサイトをローカルで運用する事ができます。
wordpressを使ったサイト制作では必須になるものなのでまとめておきます。

ポート番号の設定

MAMPインストール時、Apacheのポート番号は8888番が設定されています。
これは元々Macに入っているApacheが80番を使っているためです。

今回はMAMP内のApacheを使用するのでポート番号を80番に設定します。

80番を指定する事で後に設定するドメインでアクセスできるようになります。

http://sample.com/index.html(ポート番号:80の場合)
http://sample.com:8888/index.html(ポート番号:8888の場合)

下記から設定の変更をおこないます。

MAMP>Preferences>ports

[Set Web & MySQL ports to 80 & 3306] をクリックしてポートを80番に変更します。

fig01

ヴァーチャルホストを有効にして複数サイトを動かす

ヴァーチャルホストを設定する事でMAMP内で複数サイトを運用する事ができます。
設定するファイルは以下の2ファイルです。

httpd.conf を設定する

MAMP内で複数サイトを運用するために、ヴァーチャルホストの機能を有効にします。

変更するファイル

/Applications/MAMP/conf/apache/httpd.conf

httpd.conf内の以下の部分を変更します。

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

#Includeの「#」を外す

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

これでMAMP内で複数のサイトを管理できるようになりました。

httpd-vhosts.conf を設定する

次に、運用するサイトのドメインと、参照先のディレクトリを設定します。
変更するファイルは以下のファイルです。

/Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

下記の記述をそのままコピー、最下部にペーストして編集します。
サイトデータのディレクトリ名、ローカルで使うドメイン名は運用するサイトの情報を設定してください。
下記の例ではドメインを公開環境のものと区別できるようにトップレベルドメイン部分をろローカル用に変更しています。

<VirtualHost *:80>
    #サイトデータの保存場所
    DocumentRoot "/Applications/MAMP/htdocs/hogehoge.com"
    #ローカルで使うドメインを指定
    ServerName hogehoge.local
    #エラーログの出力場所を指定
    ErrorLog "/Applications/MAMP/logs/hogehoge.com" #エラーログの出力場所を指定
</VirtualHost>

2サイト目以降については上記の記述を下に複製して該当箇所を編集する事で設定ができます。

上記の2ファイルの編集が完了したら一度MAMPを再起動します。
これでヴァーチャルホストの設定は完了です。

hostsファイルを変更する

バーチャルホストで設定したドメインへアクセスできるように、hostsファイルを編集します。
設定するファイルは以下のファイルです。

/private/etc/hosts

以下の記述を追加します。

127.0.0.1 hogehoge.local

複数サイトを設定する場合は上記の記述をコピペして下に貼り付けてからドメインを変更しください。

hostsファイルをそのまま編集しようとすると管理者権限がないため編集ができない場合があります。
その際は、一旦hostsファイルを別の場所へコピペしてエディターで編集後、元ファイルを上書きする事で変更する事ができます。(macのID,PASSの入力が必要)

これで設定が完了しました。

設定したドメインでブラウザからアクセスする事で表示が確認できるようになります。
(先頭にhttp://を付けてアクセスしてください)

http://hogehoge.local

以上です。