(Mac)ApacheのVirtual Hostでローカル開発環境を構築する

ApacheのVirtual Hostで開発環境を構築する

MacでWebサーバーソフト、Apache HTTP Server(以下Apache)を使用して
Webサイトのローカル開発環境を作成する方法をメモします。
(MacにはデフォルトでApacheがインストールされています)

ひとつのWebサーバーで複数のサイトを管理する事が出来る、ApacheのVirtual Hostという機能を使用します。

環境 : Mac OS High Sierra 10.13.12、Apache 2.4.28

Apacheの起動と確認

ターミナルを開き、以下のコマンドを叩いてApacheのバージョンを確認出来ます。
httpd -version
もしくは
httpd -v

Apacheを起動する

sudo apachectl start

ブラウザからhttp://localhost/へアクセスしてApacheの起動を確認する。

デフォルトで用意されている以下のページが表示されればOK

 

テストページを作成する

ホームディレクトリ配下にあるSitesディレクトリ内へ開発するサイトのソースを格納するディレクトリを作成します。

apache-test/index.htmlを作成

index.html

Apacheの設定を変更する

作成したテスト用ページへブラウザからアクセスするために
以下の設定ファイルに変更を加えていきます。

  • /etc/apache2/extra/httpd-vhosts.conf

  • /etc/apache2/httpd.conf

  • /etc/apache2/users/(ユーザ名).conf

/etc/apache2/extra/httpd-vhosts.confを編集する

ターミナルから管理者権限でファイルを開く。

INSERTモードに切り替え以下のように編集する。

※<VirtualHost *:80>タグで囲まれた中身を確認する。
※ 初期状態で2つありますが、下の方を変更すればOKです。

タグ内の以下の箇所を指定する

「DocumentRoot」
サイトの公開ディレクトリを指定する
(作成したテスト用ページを格納するディレクトリパス)
「ServerName」
ページにアクセスするためのホスト名を指定する

後から他のサイトの公開ディレクトリを追加する場合は
VirtualHostタグを丸ごとコピーして下に追記し、
DocumentRootとServerNameを追加したいサイトのものへ書き換えればOKです。

/etc/apache2/httpd.confを編集する

ターミナルから管理者権限でファイルを開く。

INSERTモードに切り替え以下の行を有効化する。
(#コメントアウトを外して有効化する)

/etc/apache2/users/(ユーザ名).confを確認する

ターミナルから管理者権限で開く。
(ファイルが無ければ作成する)

(中身)

Directoryタグの指定が、Sitesディレクトリのパスになっていることを確認します。

こちらのファイルは/etc/apache2/httpd.confからインクルードしている/etc/apache2/extra/httpd-userdir.confからさらにインクルードして読み込まれています。

Apacheを再起動して設定を反映

以下のコマンドを実行しApacheを再起動します。

ホスト名の対応付けとアクセス

Apacheの設定が完了したら/etc/hosts ファイルを編集して
/etc/apache2/extra/httpd-vhosts.conf内でServerNameへ指定したホスト名を
ローカルホストのIPアドレス127.0.0.1と紐付けます。

/etc/hostsファイルを管理者権限で開く。

localhostの後、半角空白開けてホスト名を追記すればOK

テストページへアクセスする

ブラウザでホスト名(apache-test)を入力してアクセス
※ファイル名がindex.htmlの場合、デフォルトアクセスとなる

初回はホスト名の前にスキームhttp://を付けてアクセスすると確実です。

公開ディレクトリをSites以外にしたい場合

公開ディレクトリをSitesディレクトリ以外の場所に指定したい場合は以下のように設定します。

(例)/Users/(ユーザ名)/Documents配下のディレクトリを指定したい

Virtual Hostのドキュメントルート

/etc/apache2/extra/httpd-vhosts.conf

/etc/apache2/users/(ユーザ名).confにDirectorytタグを追加して
/Users/(ユーザ名)/Documentsで公開出来るようにする。

記述が完了したら、Apacheを再起動してアクセス確認をします。

アクセスが上手くいかないとき

Apacheの設定ファイルに記述ミスがある場合、ページへアクセス出来ません。

「You don’t have permission to access / on this server.」や
「このサイトにアクセスできません」等のエラーがブラウザに表示されます。

以下のコマンドを実行し、設定ファイルの記述エラーをチェックします。

apachectl configtest
もしくは
apache2ctl configtest

エラーの存在するファイル名や、行番号が確認出来ます。

正しく修正出来たらApacheを再起動して再度アクセス確認します。

Follow me!

(Mac)ApacheのVirtual Hostでローカル開発環境を構築する” に対して1件のコメントがあります。

この投稿はコメントできません。