[dev: Charles with Vagrant] Actual terminal test in VM via HTTP proxy. #vagrant #charles #test #dev

charles.md

Overview

iPhone, iPad, Android など [ios] [android] の実機テストについて、 Vagrant で建てたローカル開発環境上のWEBサーバにアクセスして行いたいよ。

Premise

実機テストしたい端末 (iPad, iPhone, Android) がローカル開発環境のあるPCと同一の Wi-Fi 上でネットワーク接続されている必要あり。

TIPS

• 有料につき30分で自動終了
• なんかおかしくなった→再起動
• iOS Chromeでつながらない→仕様です
• キャッシュ無効
  • Menu > Tools > No Chaching..

---

Installation & Process

1. Charles の Download & Install
   • http://www.charlesproxy.com/
2. Charles 立ち上げ
   • Firewall 許可
   • FireFox Addon 導入
3. Proxy > Proxy Settings で Port 設定
   • Defaults: 8888
   • 他と競合しなければなんでも
   • チェックボックスは無視
4. PC側(VagrantホストOS)のIPを取得
   • ipconfig
5. 実機テスト端末のWifiにHTTPプロキシを設定
   • iPad なら 設定>Wi-Fi>HTTPプロキシ(手動)
   • 「サーバ」にホストOSのIP入力
   • 「ポート」にCharlesのポート入力
6. ホストOSに新規アクセス通知→Allow
7. 実機テスト端末ブラウザでサーバにアクセス
   • Vagrant: 192.168.33.10