📱実機でモックAPIを叩く
初めまして、taiseiと申します。
開発環境でAPIの動作を確認するため、多くのモバイルアプリ開発者はモックAPIを利用します。しかし、実機から直接モックAPIを叩くための設定が必要です。この記事では、その設定方法について解説します。
対象と想定
今回の対象者はモバイルアプリ開発のフロントエンドエンジニアを想定しています。具体的には、フロントエンド開発者がバックエンド開発者と互いに依存することなく作業を進め、APIが準備できる前に実機でモックAPIを試すケースを想定しています。
では、本題に入ります。
1. モックAPIの設定
まず、本番APIを模倣したモックAPIを作成します。モックAPIを用いると、本番APIが完成する前でもフロントエンドの動作確認を行うことができます。ツールとしてはPostmanやMockoonがあり、これらを利用するとモックAPIの作成が簡単になります。
例えば、下記のようなものです。
https://localhost:3000/users/{userId}
2. ネットワークの設定
モックAPIがホストされているサーバー（通常は開発端末）と実機が同じネットワークに接続されていることを確認します。つまり、実機と開発端末が同じWi-Fiに接続されていることを意味します。これは、ローカルネットワーク内での通信を行うために必要です。
3. モックAPIのURLを変更
次に、実機からモックAPIを叩くために、URLのホスト名をモックAPIがホストされているマシンのIPアドレスに変更します。これは、"localhost"がローカルホスト（自身）を指すため、実機から見た"localhost"は実機自体となり、ホストマシンのモックAPIにアクセスできないからです。
例えば、下記のように変更します。
https://localhost:3000/users/{userId}
// ホスト名をIPアドレスに変更する
https://199.999.99.9:3000/users/{userId}
IPアドレスを調べる方法は下記の記事が参考になります。
mac
Windows
以上で設定は完了です！
4. 実機を接続してアプリを動かす
全ての設定が完了したので実機からモックAPIを叩き、期待通りのレスポンスが得られることを確認します。結構簡単でしたね。
うまくいかない場合
通信がうまくいかない場合、ファイアウォールの設定やセキュリティソフトウェアがモックAPIの通信をブロックしていないか確認してください。また、ネットワークの問題、モックAPIサーバーの起動忘れ、ホストマシンのIPアドレスの変更なども原因となることがあります。
まとめ
実機からモックAPIを叩くことにより、アプリケーションが実際のデバイス環境でどのように動作するかを理解することができます。これにより、より堅牢で信頼性の高いソフトウェアを作成することが可能となります。
皆さんもぜひ今回紹介した手順でモックAPIを実機から叩いて開発を効率化させてみてはいかがでしょうか。
以上です。ありがとうございました！
参考資料
Discussion