0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Androidエミュレータによりwebページで現在地取得できない問題の対策

Posted at

概要

次のような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 が再起動したら設定が反映される
0
0
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
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?