Charlesでバッグをつかむ
樊浩柏科学院に先発する
CharlesはMacでよく使われるネットワークパッケージを切り取るツールです(Win環境もサポートされている)、モバイル端末の開発過程において、我々は常にネットワークパケット分析サービス端の通信プロトコルを切り取る必要がある.Charlesは自分でシステムのネットワークアクセスエージェントサーバーに設定し、SSLエージェントを提供できるだけでなく、トラフィックの制御、再送信ネットワーク要求のサポート、ネットワーク要求パラメータの修正のサポート、ネットワーク応答の切り取りと動的修正のサポートを行う.
チャールズのインストール
Charlesの公式サイトから最新のインストールパッケージをダウンロードし、ダウンロードが遅くインストールが完了すればよい.
Charlesは有料ソフトで、もちろん無料状態でも利用できます.次の情報を使用して登録を完了できます.
登録に失敗した場合は、この方法を試してみてください.
システムエージェントサーバに設定
Charlesは自分自身をエージェントサーバに設定することによってパッケージの切り取りを完了するため、最初のステップはCharlesをシステムのエージェントサーバに設定する必要がある.
Charlesを起動すると、メニューの「Proxy」->「Windos Proxy(またはMac OS X Proxy)」で、Charlesをシステムエージェントに設定します.次のようになります.
構成すると、インタフェースに切り取られたネットワークリクエストが表示されます.ただし、ChromeおよびFirefoxブラウザでは、デフォルトではシステムのプロキシサーバ設定は使用されませんので、ChromeおよびFirefoxをシステムのプロキシサーバに設定するか、アドレス
ChromeにHost Switch Plusプラグインがインストールされている場合は、一時的に閉じる必要があります.
ネットワーク要求のフィルタ
一般的には、指定したサーバで送信されたリクエストをリスニングするだけで、次の方法で解決できます.方式1:メインインタフェース「Sequence」->「Filter」バーの位置にフィルタするキーワードを入力すればよい.例えば 方式2:Charlesのメニューバーで「Proxy」->「Recording Settings」を選択し、Includeバーを選択して、Webサイトを切り取る必要があるプロトコル、ホストアドレス、ポート番号を主に記入する永続フィルタルールを追加します. 方式3:フィルタリングが必要なネットワーク要求を右クリックし、「Focus」オプションを選択すればよい.
方式1および方式3は、一時的ネットワーク要求を迅速にフィルタリングし、方式2を用いて永続的ネットワーク要求をフィルタリングすることができる.
モバイルデバイスネットワークパッケージの切り取り
Charlesは,ローカルのネットワークパケットを切り取ることができるほか,プロキシサーバとしてもモバイルデバイスのネットワーク要求パケットを切り取ることができる.
Charlesの設定
モバイルデバイスのネットワークパッケージを切り取る場合は、Charlesのエージェント機能をオンにする必要があります.Charlesのメニューバーで「Proxy」->「Proxy Settings」を選択し、デフォルトのプロキシポート8888に入力し、「Enable transparent HTTP proxying」をチェックして設定を完了します.次の図に示します.
iPhone
まず、Charlesのトップメニューの「Help」->「Local IP Address」からローカルコンピュータのIPアドレスを取得します.例えば、私のパソコンは
iPhoneの「設定」->「無線LAN」では、現在のLAN接続に対してHTTPエージェントを設定します(ポートのデフォルトは8888).
設定が完了したら、iPhoneの任意のプログラムを開き、Charlesで接続確認ウィンドウをポップアップし、「Allow」をクリックすればよい.
Android
AndroidでiPhoneと操作するのは、一部のシステムの設定方法が一致していないだけです.
Httpsパッケージの切り取り
Httpsプロトコル情報を切り取って分析する必要がある場合は、CharlesのCA証明書をインストールする必要があります.
ローカル通信情報
Charlesの上部メニューをクリックし、「Help」->「SSL Proxying」->「Install Charles Root Certificate」を選択すると、証明書のインストールが完了します.次の図に示します.
信頼できるルート証明書発行機関のストレージ領域に証明書をインストールすることをお勧めします.
特に、証明書のインストールが完了しても、CharlesはHttpsネットワーク通信の情報を切り取らないのがデフォルトです.分析サイトHttpsリクエストを切り取る必要がある場合は、リクエストレコードを右クリックし、図に示すようにSSL proxyを選択します.
モバイルデバイスの通信情報
iPhoneやAndroid機器でHttpsプロトコルの通信内容を切り取る場合は、携帯電話に証明書をインストールする必要があります.Charlesの上部メニューをクリックし、「Help」->「SSL Proxying」->「Install Charles Root Certificate on a Mobile Device or Remote Browser」を選択し、Charlesのヒントに従ったインストールチュートリアルにインストールすればいい.次の図に示します.
上記のモバイルデバイスネットワークパケットを切り取って携帯電話にエージェントを設定した後、携帯電話ブラウザでアドレス
SSL proxy後に次のエラーが発生した場合:
証明書を信頼に設定できます.たとえば、iPhoneの「設定」→「共通」→「ネイティブについて」→「証明書信頼設定」などです.
スローリクエストのシミュレーション
App開発のデバッグでは、遅いリクエストや高い遅延ネットワークをシミュレートして、ネットワークの異常な状況でアプリケーションが正常に変化しているかどうかをテストする必要がありますが、Charlesを使用すると簡単に完了できます.
Charlesのメニューから「Proxy」->「Throttle Settings」項目を選択し、ポップアップウィンドウで「Enable Throttling」にチェックマークを付け、Throttle Presetのタイプを設定します.次の図に示します.
もちろん、「Only for selected hosts」項目では、指定したサイトの遅いリクエストのみをシミュレートできます.
要求内容の変更
サービス側のインタフェースをデバッグするために、異なるパラメータのネットワークリクエストを繰り返し試行する必要がある場合があります.Charlesは、ネットワーク要求の修正および再送機能を容易に提供することができる.このネットワークリクエストを右クリックして「Component」を選択するだけで、編集可能なネットワークリクエストを作成できます.
URLアドレス、ポート、パラメータなど、リクエストの情報を変更し、「Execute」をクリックすると、変更後のネットワークリクエストを送信できます.Charlesは、次の図に示すように、サーバ側とインタフェースをデバッグするのに便利なように、リクエストの変更と送信を複数回サポートします.
応答内容の変更
デバッグを容易にするために、サーバが特定の応答内容を返す必要がある場合があります.例えば、データが空またはデータ異常の場合、部分的に時間がかかるネットワーク要求がタイムアウトした場合などである.通常、サービス側に協力させ、対応するデータを構築するのは面倒ですが、この場合、Charlesを使用すると私たちのニーズを満たすことができます.
Charlesは、シーンのニーズに応じてMap機能、Rewrite機能、Breakpoints機能を提供し、サーバからのコンテンツの返却を変更することができます.この3つの機能の違いは、次のとおりです. Map機能は、ある要求を長期的に別のネットワークアドレスまたはローカルファイルにリダイレクトするのに適している. Rewrite機能は、ネットワーク要求のいくつかの正規置換に適している. Breakpoints機能は一時的な修正に適しています.
Map機能
CharlesのMap機能にはMap RemoteとMap Localの2種類があります.Map Remoteは、指定されたネットワーク要求を別のウェブサイト要求アドレスにリダイレクトし、Map Localは指定されたネットワーク要求をローカルファイルにリダイレクトする.Charlesのメニューから「Tools」->「Map Remote」または「Map Local」を選択すると、対応する機能の設定ページにアクセスできます.
Map Remote機能(Enable Map Remoteを選択)については、ネットワークリダイレクトのソースアドレスと宛先アドレスを記入する必要があります.他の必須でないフィールドは空白にすることができます.次の図は、テスト環境
Map Local機能(Enable Map Localを選択)では、リダイレクトされたソースアドレスとローカルのターゲットファイルを記入する必要があります.複雑なネットワークリクエストの結果がある場合は、Charlesが提供する「Save Response...」機能を使用して、リクエスト結果をローカルに保存し、少し修正してターゲットマッピングファイルにすることができます.
Rewrite機能
Rewrite機能は、修正結果の目的を達成するために、ある種類のネットワーク要求をいくつかの正則的に置き換えるのに適しています.
例えば、サービス側から返される
応答の
「Enable Rewrite」を選択して、次のように応答して、Rewrite機能を有効にします.
Breakpoints機能
上記のRewrite機能はロットと長期の置き換えに最適ですが、ネットワークリクエストの結果を一時的に変更したい場合が多いので、この場合はBreakpoints機能を使用したほうがいいです.
ブレークポイントが必要なリクエストを右クリックして「Breakpoints」を選択し、アドレスを再リクエストすると、クライアントが保留されていることがわかります.Charles操作インタフェースは次のとおりです.
この場合、リクエスト情報を変更できますが、ここではレスポンス情報のみを変更するので、「Execute」をクリックして「Edit Response」項目を選択し、titleを
「Execute」をクリックすると、応答のtitleが
あつりょくしけん
CharlesのRepeat機能を使用して、サーバの同時処理能力を簡単にテストできます.測定したいネットワークリクエストを右クリックし、次のように「Repeat Advanced」を選択します.
これにより、上図のダイアログボックスで、圧力測定の同時スレッド数と圧力測定回数を選択し、決定した後、圧力テストを開始することができます.
逆プロキシ
Charlesのリバースエージェント機能により、ローカルのポートをリモートの別のポートにマッピングできます.
CharlesはMacでよく使われるネットワークパッケージを切り取るツールです(Win環境もサポートされている)、モバイル端末の開発過程において、我々は常にネットワークパケット分析サービス端の通信プロトコルを切り取る必要がある.Charlesは自分でシステムのネットワークアクセスエージェントサーバーに設定し、SSLエージェントを提供できるだけでなく、トラフィックの制御、再送信ネットワーク要求のサポート、ネットワーク要求パラメータの修正のサポート、ネットワーク応答の切り取りと動的修正のサポートを行う.
チャールズのインストール
Charlesの公式サイトから最新のインストールパッケージをダウンロードし、ダウンロードが遅くインストールが完了すればよい.
Charlesは有料ソフトで、もちろん無料状態でも利用できます.次の情報を使用して登録を完了できます.
Registered Name: https://zhile.io
License Key: 48891cf209c6d32bf4登録に失敗した場合は、この方法を試してみてください.
システムエージェントサーバに設定
Charlesは自分自身をエージェントサーバに設定することによってパッケージの切り取りを完了するため、最初のステップはCharlesをシステムのエージェントサーバに設定する必要がある.
Charlesを起動すると、メニューの「Proxy」->「Windos Proxy(またはMac OS X Proxy)」で、Charlesをシステムエージェントに設定します.次のようになります.
構成すると、インタフェースに切り取られたネットワークリクエストが表示されます.ただし、ChromeおよびFirefoxブラウザでは、デフォルトではシステムのプロキシサーバ設定は使用されませんので、ChromeおよびFirefoxをシステムのプロキシサーバに設定するか、アドレス
127.0.0.1：8888に直接設定する必要があります.ChromeにHost Switch Plusプラグインがインストールされている場合は、一時的に閉じる必要があります.
ネットワーク要求のフィルタ
一般的には、指定したサーバで送信されたリクエストをリスニングするだけで、次の方法で解決できます.
fanhaobaiが入力されると、fanhaobai情報のみを含む要求がフィルタ出力される.方式1および方式3は、一時的ネットワーク要求を迅速にフィルタリングし、方式2を用いて永続的ネットワーク要求をフィルタリングすることができる.
モバイルデバイスネットワークパッケージの切り取り
Charlesは,ローカルのネットワークパケットを切り取ることができるほか,プロキシサーバとしてもモバイルデバイスのネットワーク要求パケットを切り取ることができる.
Charlesの設定
モバイルデバイスのネットワークパッケージを切り取る場合は、Charlesのエージェント機能をオンにする必要があります.Charlesのメニューバーで「Proxy」->「Proxy Settings」を選択し、デフォルトのプロキシポート8888に入力し、「Enable transparent HTTP proxying」をチェックして設定を完了します.次の図に示します.
iPhone
まず、Charlesのトップメニューの「Help」->「Local IP Address」からローカルコンピュータのIPアドレスを取得します.例えば、私のパソコンは
192.168.1.102です.iPhoneの「設定」->「無線LAN」では、現在のLAN接続に対してHTTPエージェントを設定します(ポートのデフォルトは8888).
設定が完了したら、iPhoneの任意のプログラムを開き、Charlesで接続確認ウィンドウをポップアップし、「Allow」をクリックすればよい.
Android
AndroidでiPhoneと操作するのは、一部のシステムの設定方法が一致していないだけです.
Httpsパッケージの切り取り
Httpsプロトコル情報を切り取って分析する必要がある場合は、CharlesのCA証明書をインストールする必要があります.
ローカル通信情報
Charlesの上部メニューをクリックし、「Help」->「SSL Proxying」->「Install Charles Root Certificate」を選択すると、証明書のインストールが完了します.次の図に示します.
信頼できるルート証明書発行機関のストレージ領域に証明書をインストールすることをお勧めします.
特に、証明書のインストールが完了しても、CharlesはHttpsネットワーク通信の情報を切り取らないのがデフォルトです.分析サイトHttpsリクエストを切り取る必要がある場合は、リクエストレコードを右クリックし、図に示すようにSSL proxyを選択します.
モバイルデバイスの通信情報
iPhoneやAndroid機器でHttpsプロトコルの通信内容を切り取る場合は、携帯電話に証明書をインストールする必要があります.Charlesの上部メニューをクリックし、「Help」->「SSL Proxying」->「Install Charles Root Certificate on a Mobile Device or Remote Browser」を選択し、Charlesのヒントに従ったインストールチュートリアルにインストールすればいい.次の図に示します.
上記のモバイルデバイスネットワークパケットを切り取って携帯電話にエージェントを設定した後、携帯電話ブラウザでアドレス
http://chls.pro/sslにアクセスすると、証明書インストールのインタフェースを開くことができる.証明書をインストールしたら、携帯電話のHttps通信内容を切り取ることができます.なお、同様に、切り取るネットワークリクエストを右クリックしてSSL proxyメニュー項目を選択する必要があります.SSL proxy後に次のエラーが発生した場合:
証明書を信頼に設定できます.たとえば、iPhoneの「設定」→「共通」→「ネイティブについて」→「証明書信頼設定」などです.
スローリクエストのシミュレーション
App開発のデバッグでは、遅いリクエストや高い遅延ネットワークをシミュレートして、ネットワークの異常な状況でアプリケーションが正常に変化しているかどうかをテストする必要がありますが、Charlesを使用すると簡単に完了できます.
Charlesのメニューから「Proxy」->「Throttle Settings」項目を選択し、ポップアップウィンドウで「Enable Throttling」にチェックマークを付け、Throttle Presetのタイプを設定します.次の図に示します.
もちろん、「Only for selected hosts」項目では、指定したサイトの遅いリクエストのみをシミュレートできます.
要求内容の変更
サービス側のインタフェースをデバッグするために、異なるパラメータのネットワークリクエストを繰り返し試行する必要がある場合があります.Charlesは、ネットワーク要求の修正および再送機能を容易に提供することができる.このネットワークリクエストを右クリックして「Component」を選択するだけで、編集可能なネットワークリクエストを作成できます.
URLアドレス、ポート、パラメータなど、リクエストの情報を変更し、「Execute」をクリックすると、変更後のネットワークリクエストを送信できます.Charlesは、次の図に示すように、サーバ側とインタフェースをデバッグするのに便利なように、リクエストの変更と送信を複数回サポートします.
応答内容の変更
デバッグを容易にするために、サーバが特定の応答内容を返す必要がある場合があります.例えば、データが空またはデータ異常の場合、部分的に時間がかかるネットワーク要求がタイムアウトした場合などである.通常、サービス側に協力させ、対応するデータを構築するのは面倒ですが、この場合、Charlesを使用すると私たちのニーズを満たすことができます.
Charlesは、シーンのニーズに応じてMap機能、Rewrite機能、Breakpoints機能を提供し、サーバからのコンテンツの返却を変更することができます.この3つの機能の違いは、次のとおりです.
Map機能
CharlesのMap機能にはMap RemoteとMap Localの2種類があります.Map Remoteは、指定されたネットワーク要求を別のウェブサイト要求アドレスにリダイレクトし、Map Localは指定されたネットワーク要求をローカルファイルにリダイレクトする.Charlesのメニューから「Tools」->「Map Remote」または「Map Local」を選択すると、対応する機能の設定ページにアクセスできます.
Map Remote機能(Enable Map Remoteを選択)については、ネットワークリダイレクトのソースアドレスと宛先アドレスを記入する必要があります.他の必須でないフィールドは空白にすることができます.次の図は、テスト環境
t.fanhaobai.comの要求を本番環境www.fanhaobai.comにリダイレクトした例です.Map Local機能(Enable Map Localを選択)では、リダイレクトされたソースアドレスとローカルのターゲットファイルを記入する必要があります.複雑なネットワークリクエストの結果がある場合は、Charlesが提供する「Save Response...」機能を使用して、リクエスト結果をローカルに保存し、少し修正してターゲットマッピングファイルにすることができます.
Rewrite機能
Rewrite機能は、修正結果の目的を達成するために、ある種類のネットワーク要求をいくつかの正則的に置き換えるのに適しています.
例えば、サービス側から返される
www.fanhaobai.comは、以下のように、すべてwww.baidu.comに置き換えられる.応答の
www.fanhaobai.comはすべてwww.baidu.comに置き換えられる.そこで「Tools」->「Rewrite」の下に、次のルールを設定します.「Enable Rewrite」を選択して、次のように応答して、Rewrite機能を有効にします.
Breakpoints機能
上記のRewrite機能はロットと長期の置き換えに最適ですが、ネットワークリクエストの結果を一時的に変更したい場合が多いので、この場合はBreakpoints機能を使用したほうがいいです.
ブレークポイントが必要なリクエストを右クリックして「Breakpoints」を選択し、アドレスを再リクエストすると、クライアントが保留されていることがわかります.Charles操作インタフェースは次のとおりです.
この場合、リクエスト情報を変更できますが、ここではレスポンス情報のみを変更するので、「Execute」をクリックして「Edit Response」項目を選択し、titleを
fanhaobai.comに変更します.以下のようにします.「Execute」をクリックすると、応答のtitleが
fanhaobai.comになったことがわかります.あつりょくしけん
CharlesのRepeat機能を使用して、サーバの同時処理能力を簡単にテストできます.測定したいネットワークリクエストを右クリックし、次のように「Repeat Advanced」を選択します.
これにより、上図のダイアログボックスで、圧力測定の同時スレッド数と圧力測定回数を選択し、決定した後、圧力テストを開始することができます.
逆プロキシ
Charlesのリバースエージェント機能により、ローカルのポートをリモートの別のポートにマッピングできます.