13
3

More than 3 years have passed since last update.

Charles for MacでAPIから返ってくるレスポンスを書き換える方法

Last updated at Posted at 2019-12-17

この記事は、ZOZOテクノロジーズ アドベントカレンダー#4の記事です。

昨日は @takewellさんの「WASI (WebAssembly system interface) を Wasmtime と Node.js で試す」でした。
明日は @koiwai2020さんの「WEARに投稿したコーディネート画像に雪を降らせて映えを狙う」です。

はじめに

先日、WEAR for iOSで使う新しいAPIクライアントを作ったのですが、その際に Charles for Mac がとても役に立ちました。

色々活躍してくれたのですが、特にシビれたのは レスポンスを書き換え出来る機能 です。

エラーハンドリング実装の際には大活躍してくれたので、この先忘れないためにも自分用のメモとしてQiitaに残しておきたいと思います。

使用するCharlesのバージョン

1. Breakpointを設定する

(1) Charlesを起動し、メニューバー内の [Proxy] > [BreakPoint Settings...] をクリックします。

スクリーンショット_2019-12-16_15_06_38.png

(2) [Enable Breakpoint] にチェックを入れて、[Add] ボタンをクリックします。

スクリーンショット_2019-12-16_15_06_58.png

(3) レスポンスを変更したいAPIのURLの詳細を入力します。各項目の説明は以下の通り。

スクリーンショット_2019-12-16_15_07_17.png

  • Scheme (GETやPOSTなどのHTTPリクエストMethod)
  • Protocol (httpsもしくはhttp)
  • Host (APIURLのドメイン)
  • Path (エンドポイント)
  • Query (パラメータ)

ちなみに今回はレスポンスの変更のみなので [Response]にのみチェックを入れます。
入力が終わったらOKボタンをクリックします。

2. Charlesでレスポンスを書き換える

では、設定が完了したので早速APIを叩いて見ましょう。

下の図のようにBreakpointsタブが出来て、先ほど設定したAPIURLの全ての通信がレスポンスを受け取る直前の状態でストップします。

[Edit Response]をクリックすれば、レスポンスヘッダーやJSON Textを書き換えることが出来ます。

スクリーンショット_2019-12-16_15_44_16.png

[Headers]をクリックすれば、レスポンスヘッダーを書き換えることが出来ます。このようにステータスコードの書き換えもモチのロン。

スクリーンショット_2019-12-16_16_13_37.png

[JSON Text]をクリックすればJSONの中身も変更することが可能です。

書き換えが終わったら [Excute]ボタンをクリックします。
すると、先ほど変更したレスポンスを受け取るようになっているはずです。

(注意: タイムアウト時間を短めにしている人は長めに設定しておきましょう。レスポンスの変更時間がタイムアウト時間を超えてしまうとエラーを受け取ってしまうので。)

Charles for Macめちゃ素敵

設定すれば、SSLの通信であってもiPhoneシミュレータや実機のレスポンスも書き換えることが出来ます。

これを入れておけば間違いなく通信周りの開発のスピードは捗ると思ったので、自分用にも1つポチることにしました。

全てのMacに標準で入っててほしい。素敵。

明日は、@koiwai2020さんの「WEARに投稿したコーディネート画像に雪を降らせて映えを狙う」です。お楽しみに!

13
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
13
3