ローカルのWebサイトを確認する方法

ローカルのWebサイトを作成している際に確認するTIPSをいくつかご紹介します。

解説はMacのみですが、Windowsでも足りないソフトをインストールすればできると思います。

まずは、
たとえば以下のようなディレクトリで作業していてindex.htmlを確認したいとします。

/Users/nishihata/Desktop/htdocs/index.html

普通にやるとブラウザのアドレスバーに以下のURLを入力するとブラウザでindex.htmlが確認できます。

file:///Users/nishihata/Desktop/htdocs/index.html

ただ、このままでは絶対パスでサイトを作成していたりすると確認できません。

ローカルサーバーを起動

そこで、Macでターミナル (Terminal)で以下のコマンドを入力してみましょう。

cd /Users/nishihata/Desktop/htdocs/
python -m SimpleHTTPServer 8888

そうすると以下のURLでindex.htmlが確認できるようになります。

http://localhost:8888/index.html

ただ、このままだとサーバーのAPIをAjaxで叩きたい時などドメインの制限を受けることがありますし、mixiチェックなど指定したドメインでしか表示されないアイテムもあります。

hostsの設定

そういった場合、まずはターミナルで以下のコマンドを入力

sudo vi /etc/hosts

passwordが聞かれるのでMacのパスワードを入力してください。

hostsファイルが表示されるので最後に以下の一文を追加します。

127.0.0.1 www.to-r.net

ファイルの変更はviで行いますので以下の記事を参考に。

viの基本的な使い方 - to-R

そうすると以下のURLでサイトが確認できるようになります。

http://www.to-r.net:8888/index.html

まだ、8888といったポート番号がじゃまですね。

ポート番号の設定

そこでターミナルで以下のコマンドを入力します。

sudo ipfw add 100 fwd 127.0.0.1,8888 tcp from any to me 80

これで80ポートへのアクセスを8888に転送してくれるようになり以下のURLで確認できるようになります。

http://www.to-r.net/index.html

これでローカルのサイトの確認も簡単にできます。

スポンサードリンク

«Android、iPhoneではbutton要素にtext-overflow:ellipsisが適用されない | メイン | Source MapでSass/Compassを簡単にCSSをデバッグする»