Macローカル環境でスマホサイトの実機テストを行う方法(2)

前回は、Macwifiアクセスポイントにするところまででした。
charlie.hateblo.jp

今回は、「MacのローカルフォルダをWebサーバーにする」です。

MacのローカルフォルダをWebサーバーにする

Macには、ApatchというWebサーバー機能がある。
これを利用する方法だ。

1.Apache設定ファイルの編集

編集するファイルは3つ。

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

finderを開き、メニューバーの「移動」から、「フォルダへ移動」を選択。
f:id:fushimik:20160223161449p:plain
フォルダの場所として、

/etc

を入力し、「移動」

apache2フォルダの中に、httpd.confがある。
念のため、編集前にバックアップをとっておこう。

httpd.confを右クリックして「このアプリケーションで開く」-「その他..」
テキストエディット.app を選択することで編集できる。
普段使っているテキストエディタがあるならそれを選択してもよいだろう。

テキスト「httpd-vhosts.conf」を検索

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

の頭の#を削除して保存。

同様に、httpd-vhosts.confも編集する。
/private/etc/apache2/extra/httpd-vhosts.conf

一番下に下記の行を追加しよう。


    DocumentRoot "/Users/user_oreore/www.oreore.com"
    ServerName local.oreore.com

DocumentRootには、Webサーバにしたいローカルフォルダをフルパスで指定しよう。ここでは、/Users/user_oreore/www.oreore.comとした。
ServerNameには、ローカルディレクトリにつけるサーバー名を指定する。ここでは、local.oreore.comとした。
複数のフォルダを別々のサーバー名で使うためには、これを繰り返して記述しよう。

最後に、hostsを編集する
/private/etc/hosts
一番下に下記を追加しよう。

127.0.0.1 local.oreore.com

127.0.0.1 は、変更の必要はない。
local.oreore.comは、httpd-vhosts.confで定義したサーバー名だ。
複数のフォルダを別々のサーバー名で使うためには、これを繰り返して記述しよう。このとき、すべての行で、127.0.0.1は同じだ。

ここまでできたら、Apatchを起動しよう。
ターミナルを起動して、以下のコマンドだ。

$ sudo apachectl start

($は入力しない)
Passwordには、普段Macを起動するときのパスワードを入力しよう。

もし、
/System/Library/LaunchDaemons/org.apache.httpd.plist: Operation already in progress
というメッセージが出たら、Apatchはすでに起動ずみなので、先ほど編集した設定ファイルを有効にするため、以下のコマンドを入力する。

$ sudo apachectl restart

これで、準備は完了。
Macでブラウザを起動して、設定したサーバー名をURL欄に入力してみよう。
http://local.oreore.com

次回は、いよいよ実機からの接続です。
charlie.hateblo.jp