概要
次のようなwebページに現在地取得APIを叩いているが、Androidエミュレータでテストする時になぜか取得失敗になる。それの解決方法をメモする。
原因
- Geolocation API は「セキュアなオリジン(HTTPS か localhost)」でしか動かない
- システムがホストPCに動いているため、Androidエミュレータはhttp://10.0.2.2しなければならない
対策
開発用の妥協策として、エミュレータの Chrome で一時的に許可する
手順(AndroidエミュレータのChrome)
1.エミュレータを起動し、Chromeを開く
- ホーム画面の「Chrome」アイコンをタップ
2.フラグ画面を開く
- アドレスバーに chrome://flags/#unsafely-treat-insecure-origin-as-secure と入力して移動
3.対象フラグを有効化
- 「Insecure origins treated as secure(不安全なオリジンを安全として扱う)」という項目が表示される
- ロップダウンを Enabled に変更
- その項目の下(または横)にオリジンを入力するテキスト欄があるので、次を正確に入力
- http://10.0.2.2:3000
- 先頭に http:// を付ける、末尾にスラッシュは付けない、ポート番号も含める
- 複数登録する場合はカンマ区切り
4.Chrome を再起動
- 画面下部に出る「Relaunch」または「再起動」をタップ
- Chrome が再起動したら設定が反映される