モバイルSafariでHTMLの位置情報共有をユーザーに促すタイミングを判定する方法

位置情報追跡の要件とは

Webアプリケーション開発では、「ユーザーが特定のエリア内にいる場合にのみ、最新の位置情報を追跡したい」という要件が発生することがあります。このようなケースでは、通常の常時追跡とは異なる専用のロジックを実装する必要があります。

HTMLのGeolocation APIを利用して、位置情報の共有をユーザーに促すタイミングを制御するコードは以下のようになります。

実装コード例

if (frstTime) { // 初回アクセスの場合
    navigator.getCurrentPosition(function (coordinates) {
        if (coordsAreInTheBox) {
            storeCoordsForUser();
            navigator.watchPosition();
        }
    });
}

else if (userInlocat) {
    navigator.watchPosition();
}

コードの動作の仕組み

このコードは、ページの初回読み込み時に期待どおりに動作します。処理の流れは以下の通りです。

まず、ユーザーが初めてサイトにアクセスしたかどうかを判定します。初回アクセスであれば、navigator.getCurrentPosition() を呼び出して現在位置を取得します。これはGeolocation APIのメソッドの一つで、ユーザーの現在地を一度だけ取得するために使用されます。

次に、取得した座標があらかじめ定義された範囲（ボックス）内に含まれているかどうかをチェックします。範囲内であれば、ユーザーの座標を保存し、navigator.watchPosition() を呼び出して以降の位置変化を継続的に監視します。

一方、初回アクセスではないものの、ユーザーがすでに対象ロケーション内にいることが確認できている場合は、即座に watchPosition() を実行して位置情報の監視を開始します。

補足：モバイルSafariでの注意点

モバイルSafariでは、位置情報へのアクセス要求はユーザーの明示的な許可が必要です。不必要なタイミングで何度も許可ダイアログを表示すると、ユーザー体験を損なう可能性があります。上記のような条件分岐による制御を行うことで、本当に位置情報が必要な場面でのみプロンプトを表示し、快適なユーザー体験を実現できます。