Macで開発環境(Apache)の設定する方法

Macで複数のローカルサーバを立てる設定（バーチャルホストの設定）と
SSIでのインクルードを有効にする手順を備忘録としてメモしました。

## 設定のゴール
・1つのApacheで複数のローカルサーバを持てるようにする
・SSIでのインクルードを有効にする


## 手順
1.作業ディレクトリの作成
2.Apacheの確認
3.httpd.confを編集
4.httpd-userdir.confを編集
5.{username}.confの作成
6.httpd-vhost.confを編集
7.hostsファイルを編集
8.Apacheを再起動


## 1.作業ディレクトリの作成
今回、案件をまとめておくホームディレクトリとして「Sites」というフォルダを作リます。
さらにSites/直下に任意のディレクトリを格納し、それをローカルサーバとして設定してみたいと思います。

>Users
>　┗ {username}
>　　┗ Sites
>　　　┣	{yourdocs1}（ローカルサーバその1）
>　　　┗ {yourdocs2}（ローカルサーバその2）


## 2.Apacheの確認
Macには最初からApacheは入っていますが、念のためターミナルを使って起動確認を行いましょう。

※ ターミナルで「sudo」というコマンドを使うときは、管理者権限が必要です。そのため、コマンドを実行するときにパスワードが求められます。ここで入力するのは、普段Macにログインするときに使うパスワードです。

```
sudo apachectl start
```
※http://localhost/ にアクセスし、画面上に「It works!」と表示されればOKです。

ちなみに、Apacheの設定ファイルは、「/private/etc/apache2/」にあります。
この設定ファイルの場所をFinderで確認するには、メニューバーの「移動」メニューから「フォルダへ移動」を選択し、パスとして「/private/etc/apache2/」を入力します。これで、Apacheの設定ファイルが入っているフォルダが表示されます。

今後の手順では、「/private/etc/apache2/」以下のファイルを編集することになります。
編集ミスの可能性も考えてバックアップを取っておくといいのですが、
既に「/private/etc/apache2/original/」にバックアップファイルが用意されています。
もし、失敗したら上記ファイルを使ってやり直してみましょう。


## 3.httpd.confを編集
httpd.confには、apacheの基本設定について記述されています。
これ以降は、ターミナル上での編集になるため、vi（vim）を使用していきます。
vimの操作方法については、別の方がまとめてくださっている記事があります。
気になる方は、ページ下部の「今回、作業するにあたってお世話になったサイト」よりご確認ください。


### 3-1.httpd.confを開く

```
sudo vi /private/etc/apache2/httpd.conf
```

### 3-2.SSIを有効にする
以下のコメントアウトされている記述について、コメントアウトを外します。

```terminal:/private/etc/apache2/httpd.conf
#LoadModule include_module libexec/apache2/mod_include.so

↓

LoadModule include_module libexec/apache2/mod_include.so
```
```terminal:/private/etc/apache2/httpd.conf
#AddType text/html .shtml
#AddOutputFilter INCLUDES .shtml

↓

AddType text/html .shtml
AddOutputFilter INCLUDES .shtml .html
```

### 3-3.ユーザーディレクトリを有効化
以下のコメントアウトされている記述について、コメントアウトを外します。

```terminal:/private/etc/apache2/httpd.conf
#LoadModule userdir_module libexec/apache2/mod_userdir.so

↓

LoadModule userdir_module libexec/apache2/mod_userdir.so
```
```terminal:/private/etc/apache2/httpd.conf
#Include /private/etc/apache2/extra/httpd-userdir.conf

↓

Include /private/etc/apache2/extra/httpd-userdir.conf
```

### 3-4.バーチャルホストを有効化
以下のコメントアウトされている記述について、コメントアウトを外します。

```terminal:/private/etc/apache2/httpd.conf
#Include /private/etc/apache2/extra/httpd-vhosts.conf

↓

Include /private/etc/apache2/extra/httpd-vhosts.conf
```


## 4.httpd-userdir.confを編集
### 4-1.httpd-userdir.confを開く
```
sudo vi /private/etc/apache2/extra/httpd-userdir.conf
```

### 4-2./private/etc/apache2/users/*.confの有効化
以下のコメントアウトされている記述について、コメントアウトを外します。

```terminal:/private/etc/apache2/extra/httpd-userdir.conf
#Include /private/etc/apache2/users/*.conf

↓

Include /private/etc/apache2/users/*.conf
```


## 5.{username}.confの作成
### 5-1.{username}.confの作成
以下のコマンドを入力して、{username}.conf を作成します。
（{username}の部分は任意です。）

```
sudo vi /private/etc/apache2/users/{username}.conf
```

### 5-2.{username}.confの編集
```terminal:/private/etc/apache2/users/{username}.conf
<Directory "/Users/{username}/Sites">
   Options Indexes FollowSymLinks Multiviews
   AllowOverride all
   Require all granted
</Directory>
```


## 6.httpd-vhost.confを編集
vhost-httpd.confには、バーチャルホストの設定について記述されています。
この作業は、作業ディレクトリ追加の度に発生します。

### 6-1.httpd-vhost.conを開く
```
sudo vi /private/etc/apache2/extra/httpd-vhosts.conf
```

### 6-2.バーチャルホストの設定
下記のように、必要なローカルサーバーの数だけファイルの最下部に記述を加えます。

```terminal:/private/etc/apache2/extra/httpd-vhosts.conf
Listen 8080
<VirtualHost *:8080>
   DocumentRoot "/Users/{username}/Sites/{yourdocs1}"
   ServerName {yourservername1}
   <Directory "/Users/{username}/Sites/{yourdocs1}">
       Require all granted
       DirectoryIndex index.html
       Options Includes
   </Directory>
</VirtualHost>

Listen 8081
<VirtualHost *:8081>
   DocumentRoot "/Users/{username}/Sites/{yourdocs2}"
   ServerName {yourservername2}
   <Directory "/Users/{username}/Sites/{yourdocs2}">
       Require all granted
       DirectoryIndex index.html
       Options Includes
   </Directory>
</VirtualHost>
```

## 7.hostsファイルを編集
hostsファイルでは、作業ディレクトリ名と、ローカルサーバのIPアドレス（127.0.0.1）の対応付けを行います。
この作業は、vhost-httpd.confと同様に作業ディレクトリ追加の度に発生します。

### 7-1.hostsファイルを開く
```
sudo vi /etc/hosts
```

### 7-2.hostsファイルを編集
先ほどhttpd-vhost.confで設定したサーバーネームにあわせて以下の記述を書き加えます。

```terminal:/etc/hosts
127.0.0.1       {yourservername1}
127.0.0.1       {yourservername2}
::1             {yourservername1}
::1             {yourservername2}
```

## 8.Apacheを再起動
ターミナルで以下のコマンドを叩いて、Apacheを再起動します。

```
sudo apachectl restart
```

再起動後、http://{yourservername1}:8080/ で自分の設定したローカルサーバーが表示できれば完了です。

最後までお読みいただき、ありがとうございました。

----
## 今回、作業するにあたってお世話になったサイト
・[よく使う Vim のコマンドまとめ - Qiita](https://qiita.com/hide/items/5bfe5b322872c61a6896)
・[【XAMPPもMAMPも不要！】Macで複数のローカルサーバ（バーチャルホスト）を立てる方法](https://web-diy.jp/2017/09/170915_01/)
・[Macのapacheを使ってバーチャルホストとSSIの設定](https://blog.funxion.jp/45/)