はじめに
こんにちは！システム開発部のYです。
担当案件で通信内容を解析する必要があり、Charlesを使用してVisionProの通信内容を確認しました。
その際、準備に少し手間取ったため、通信内容を表示するまでの手順を以下にまとめたいと思います。
Charlesの概要
Charlesは、PC上で動作するWebプロキシツール（HTTP Proxy / HTTP Monitor）です。
Webブラウザやアプリケーションの通信経路をCharles経由に設定することで、インターネットへの送受信データを可視化し、解析することが可能です。
※CharlesはApple Silicon 版のMacにはベータ版で対応しており、多少UIが異なります。
ベータ版 (v5.0b16) でも以下の手順は問題なく実現できます。
備考
Charlesはシェアウェアで、30日間の無料試用版が提供されています。
試用期間が終了した後も、1回あたり30分の制限付き試用版として引き続き使用可能です。
30分が経過するとアプリが自動的に終了しますが、再起動することで再び使用できます。
有料版は1ライセンスあたり$50で購入できます。
詳しくは、公式サイトをご確認ください。
環境
- visionOS: 2.0
- macOS: 14.3.1 Wi-Fi接続
- Charles: v4.3.3
準備
Macの設定
Macの設定は、iOSアプリの通信状況を解析する場合と同じ設定です。
Charles をダウンロードし、Macにインストール
公式サイト: https://www.charlesproxy.com
Proxy Settings
- Charles を起動し、Proxy > Proxy Settings を開いて設定を行う
- HTTP ProxyのPortに任意のポート番号を設定（例: 8888など）
- Support HTTP/2とEnable transparent HTTP proxying にチェックを入れる
SSL Proxying Settings
- Proxy > SSL Proxying Settings を開き、設定を行う
- SSL Proxying タブの Include セクションで Add を選択し、
*（アスタリスク）を追加
これにより、SSL通信の内容を確認できるようになる - Enable SSL Proxying にチェックを入れる
IPアドレスの把握
Help > Local IP Addresses を選択し、表示されたIPアドレスを確認します。
Macに証明書をインストール
- Charles を開き、Help > SSL Proxying > Install Charles Root Certificate を選択して証明書をインストール
- Keychain Access.appを起動し、確認シートより「常に信頼」を選択
VisionProの設定
Wifiネットワークのプロキシ構成を変更
- ホーム画面から設定アプリを起動
- Wi-Fiを選択し、接続中のWi-Fiネットワークの詳細画面を開く
- HTTP ProxyをConfigure ProxyからManualに変更
- 以下の内容を入力
- Server: 確認したLocal IP Addressを入力
- Port: HTTP ProxyのPortに設定したポート番号を入力
- 入力後、画面右上のSaveをタップして保存
SSL証明書をVisionProにダウンロード、インストール
証明書をVisionProにダウンロードする方法は、「PCからVisionProに転送する場合」、「VisionProから直接ダウンロードする場合」の2通りがあります。
PCからVisionProデバイスに転送する場合
- 証明書のダウンロード
PCでCharlesを開き、Help > SSL Proxying > Save Charles Root Certificate から
Binary certificate (.cer)を選び保存します。
- VisionPro端末への転送
ダウンロードした.cerファイルをAirDropなどを使用してVisionPro端末に転送します。
VisionProデバイスから直接ダウンロードする場合
CharlesとVisionProがつながっている状態で、VisionProで以下のURLにアクセスすると証明書がダウンロードされます。
http://www.charlesproxy.com/getssl
アクセスすると証明書がダウンロードされます。
VisionProで証明書をインストール
VisionProで設定アプリを起動し、以下の手順でダウンロードした証明書をインストールします。
- General > VPN & Device Management > Downloaded Profile を選択
- Install を選択し、インストールを完了
証明書を有効にする
- 設定アプリを起動
- General > About > Certificate Trust Settings に進む
- インストールした証明書を選択し、スイッチを ON に切り替える
解析
準備完了後、VisionProで通信をすればCharlesの画面に通信内容が表示されます。
まとめ
CharlesでVisionProの通信を解析する方法についてまとめました。
筆者は、VisionProにSSL証明書をインストールしたものの、証明書を有効にするのを忘れてしまい、多くの時間を浪費してしまいました。その場所が非常に分かりづらかったためです。
この記事が少しでもお役に立てれば幸いです。また、間違っている点があればご指摘いただけるとありがたいです。
