iPhoneからCharlesを使ってMacで立てたlocalホストにアクセスする

Webアプリケーションを開発/テストしている際に、PCのブラウザとiPhoneのブラウザでは挙動が異なることがある。

ローカルで修正した箇所をiPhoneで正常に動作しているか確認するためにも、一度テスト用Webサーバーにデプロイしなければいけないという手間も発生する。iPhoneからLocalホストに繋ぐことができればこういったデプロイの手間を省くことができる。

またこの方法を用いることでiPhoneからの通信キャプチャも可能だ。

Windowsで立てたLocalホストに接続するにはFiddlerが便利だが、その方法についてはiPhone から開発マシンの localhost にアクセスする（Windows）を参考にしていただきたい。

Charlesの設定

1. Charlesのインストール
   Charlesのインストールはこちらから。
   無料版も30分で強制的にアプリが再起動されるが、気にせず使える。

2. Charlesでポートの確認/設定する
   Proxy -> Proxy Settingsを開き、portを8888に設定。
   
   

iPhoneの設定

1. 開発マシンのIPアドレス確認
   

2. iPhoneでプロキシを構成
   接続しているWifiの設定(iボタン)から「プロキシを構成」を選び、「手動」を選択するとサーバー・ポートが設定できるようになるので以下のように値を入力する。

1. 接続の確認
   iPhoneでブラウザを開いた際にCharlesで通信をキャプチャできていれば、接続は成功である。
   

localhostへの接続

あとはPCと同じように使用したいブラウザのURL入力欄でhttp://localhost.:{Localサーバーのポート番号}と入力すれば完了