Flutterでプロトタイプ用アプリがiPhoneでは正常に動作し、Chromeで表示してMacでテストした際も問題なかったので、試験的にデプロイしてみました。しかしデプロイ後、iPhoneからアクセスしてテストしたところ、一部の機能が動作しないケースが発生したので、iPhoneのSafariでアクセスしてテストしようと考えました。
同じWi-Fiに接続されていますが、どのURLでアクセスできるか方法を調べてみました。
まず、開発環境を実行したコンピュータのIPアドレスを確認する必要があります。IPを確認する方法はたくさんあります。
IPの確認方法#
Macユーザー向けに説明します。上部にWi-Fiアイコンがあれば、Optionキーを押しながらWi-Fiアイコンをクリックしてください。
すると通常とは異なり、このように表示され、接続しているWi-Fi付近で割り当てられたIPを確認できます。
システム設定 -> Wi-Fi -> 接続中のWi-Fiの詳細ボタンをクリックでもIPアドレスを確認できます。
ターミナルで確認するにはifconfig | grep inetと入力してください。すると6行目でnetmaskというテキストの前にIPを確認できます。
iPhoneからアクセスする#
VS CodeでFlutterをデフォルト設定のままchromeで接続すると、つながりませんでした。
代わりにflutter run -d chrome --web-hostname=0.0.0.0 --web-port=8080で実行し、Chromeが起動したらアドレスバーでIPアドレスを変更してからコピーしてください。
iPhoneで任意のブラウザを選択し、アドレスバーでペーストして移動を押して少し待つと接続されるはずです！すると以下のようにiPhoneのSafariからアクセスした画面が表示されます。
In peace, sons bury their fathers. In war, fathers bury their sons.
— Herodotus
