HOMEビジネス ローカルのファイルを参照させるアプリ、WEB DEBUGGING PROXY「Charles」

ローカルのファイルを参照させるアプリ、WEB DEBUGGING PROXY「Charles」

casemobile公式

2014/03/03(最終更新日:2014/03/03)


このエントリーをはてなブックマークに追加

ローカルのファイルを参照させるアプリ、WEB DEBUGGING PROXY「Charles」 1番目の画像
 他のブログでもたまに取り上げられているので、わざわざ紹介しなくても良いかなと思っていたのですがものすごく便利なのでやっぱり紹介したいアプリ。それがプロキシデバッグアプリ「Charles」!「私の救世主や〜!!!」というぐらい便利に使えるときがあります。

プロキシデバッグ!Charlesって何?

 Charlesを使うことで、Webの通信のデバッグを行うことができます。いろいろなデバッグができるのですが、本記事では「マップローカル」という機能を紹介します。この機能を使うと、指定したファイルだけローカルのファイルを参照させることが出来るようになります。つまり、本番環境でJSやCSSだけローカルのテストファイルに差し替えてデバッグができるようになるということです。

 テスト環境が無かったり、本番環境とテスト環境が違う動作をしてしまう場合には有効なデバッグ方法だと思います。ちなみに、こちらのCharlesは有料アプリですが、購入前でもお試しすることができます。お試し版は、毎回30分間のみしか起動しません。

使い方

 Macの場合の使い方です。Charlesを起動し、ツールバーの「Tool」から「Map Local」へと進みます。すると、下記の画面が表示されます。
ローカルのファイルを参照させるアプリ、WEB DEBUGGING PROXY「Charles」 2番目の画像
 「Add」ボタンからローカルファイルを参照するURLを設定します。「Port」や「Query」は空の状態でも大丈夫です。そして「OK」を押して確定します。
ローカルのファイルを参照させるアプリ、WEB DEBUGGING PROXY「Charles」 3番目の画像
 もう一度「OK」を押します。
ローカルのファイルを参照させるアプリ、WEB DEBUGGING PROXY「Charles」 4番目の画像
 最後にツールバーの「Proxy」から「Mac OS X Proxy」にチェックを入れます。このチェックを入れ忘れると、設定が反映されないので忘れないようにしてください。
ローカルのファイルを参照させるアプリ、WEB DEBUGGING PROXY「Charles」 5番目の画像
 設定が完了したら、マップローカルで設定したURLのファイルがローカルのファイルを読むようになるのでブラウザでデバッグしていきます。簡単で便利ですので、ぜひお試しを!
※Win/Mac版があります。
価格
1-4 User LicensesUS$50 / license
5+ User LicensesUS$40 / license (20% discount)
10+ User LicensesUS$30 / license (40% discount)
※お試しバージョンもあり。(1回30分起動の制限付き)


hatenaはてブ


この記事の関連キーワード