マップアプリ連携 URL Scheme

Prev Next

Classic/VPC環境で利用できます。

参考

NAVERクラウドプラットフォームサービスで提供していた Maps APIサービスがアップグレードされ、新たにリリースされました。NAVERマップコンテンツのカスタムスタイリング機能が追加された 新しい Maps サービスをご利用ください。

NAVERマップアプリの URL Schemeを使用して、ユーザーアプリやウェブページから NAVERマップアプリを呼び出すことで、NAVERマップ機能を使用できます。

構文

NAVERマップアプリの URL Schemeは nmap://で始まり、構文の形式は次の通りです。

naverapp-urlscheme-syntax_ko

構成要素 説明 必須有無
nmap:// NAVERマップアプリアクセス URL Scheme 必須
actionPath 呼び出しアクション 必須
parameter=value 呼び出しアクションによる入力パラメータと入力値 アクションによって異なる。詳細は、URL Scheme を使用するを確認
appname URL Schemeを使用するアプリまたはウェブページを識別する文字列
  • アプリ: アプリの applicationId
  • iOSアプリ: アプリのバンドル ID
  • モバイルウェブ: ウェブページの URL
必須。すべての URLには、appname パラメータを必ず含めること

事前設定

NAVERマップの URL Schemeは、ユーザーのデバイスに NAVERマップアプリがインストールされている場合にのみ使用できます。そのため、NAVERマップアプリがインストールされていない場合、App Storeや Google Playから NAVERマップアプリをインストールできるようにコードを作成する必要があります。動作環境別(モバイルアプリ、モバイルウェブ、アプリ内ブラウザ)に作成するコードは、次の通りです。

モバイルアプリ

NAVERマップの URL Schemeを使うためにモバイルアプリで作成するコードは、次の通りです。

Android

次のサンプルコードのように queryIntentActivitiesを呼び出して NAVERマップアプリがインストールされているか確認し、インストールされていない場合は Google Playに移動します。

String url = "nmap://actionPath?parameter=value&appname={YOUR_APP_NAME}";

Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
intent.addCategory(Intent.CATEGORY_BROWSABLE);

List<ResolveInfo> list = getPackageManager().queryIntentActivities(intent, PackageManager.MATCH_DEFAULT_ONLY);
if (list == null || list.isEmpty()) {
    context.startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse("market://details?id=com.nhn.android.nmap")));
} else {
    context.startActivity(intent);
}

iOS

iOSモバイルアプリで作成するコードは、次の通りです。

  1. Info.plistに LSApplicationQueriesSchemesを作成し、nmapを追加します。
<key>LSApplicationQueriesSchemes</key>
<array>
    <string>nmap</string>
</array>
  1. 次のように canOpenURLを呼び出して NAVERマップアプリがインストールされているか確認し、インストールされていない場合は App Storeに移動します。
let url = URL(string: "nmap://actionPath?parameter=value&appname={YOUR_APP_NAME}")!
let appStoreURL = URL(string: "http://itunes.apple.com/app/id311867728?mt=8")!

if UIApplication.shared.canOpenURL(url) {
  UIApplication.shared.open(url)
} else {
  UIApplication.shared.open(appStoreURL)
}

モバイルウェブ

モバイルウェブで NAVERマップの URL Schemeを使うためには、NAVERマップアプリをインストールするように実装する必要があります。

Android

インテント URLを使用すると、アプリがインストールされていない場合、自動的に Google Playストアに移動します。インテント URLの構造は次の通りです。

intent://actionPath?parameter=value&appname={YOUR_APP_NAME}#Intent;scheme=nmap;action=android.intent.action.VIEW;category=android.intent.category.BROWSABLE;package=com.nhn.android.nmap;end

以下は、(37.4979502, 127.0276368)の位置に「京畿道 城南市 盆唐区 亭子洞」のマーカーを表示する URL Schemeをインテント URLで表したユースケースです。

intent://place?lat=37.4979502&lng=127.0276368&name=%EA%B2%BD%EA%B8%B0%EB%8F%84%20%EC%84%B1%EB%82%A8%EC%8B%9C%20%EB%B6%84%EB%8B%B9%EA%B5%AC%20%EC%A0%95%EC%9E%90%EB%8F%99&appname=com.example.myapp#Intent;scheme=nmap;action=android.intent.action.VIEW;category=android.intent.category.BROWSABLE;package=com.nhn.android.nmap;end

iOS

以下のようにウェブページから JavaScriptタイマーを使って App Storeに分岐させる方法を使います。


アプリ内ブラウザ

アプリ内ブラウザで URL Schemeを使用するには、次のように URL Scheme処理コードを追加する必要があります。

Android

以下のように WebViewClientshouldOverrideUrlLoadingを上書きして URL Scheme処理コードを追加します。

@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
    if (url.startsWith("intent:")) {
        Intent intent;
        try {
            intent = Intent.parseUri(url, Intent.URI_INTENT_SCHEME);
        } catch (URISyntaxException e) {
            return false;
        }
        if (TextUtils.isEmpty(intent.getPackage())) {
            return false;
        }
        List<ResolveInfo> list = getPackageManager().queryIntentActivities(intent, PackageManager.MATCH_DEFAULT_ONLY);
        if (list == null || list.isEmpty()) {
            startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse("market://details?id=" + intent.getPackage())));
        } else {
            startActivity(intent);
        }
        return true;
    }

    return false;
}

iOS

以下のように WKWebviewdecidePolicyForに URL Scheme処理コードを追加します。

func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
    if let url = navigationAction.request.url {
        if url.scheme == "nmap" {
            UIApplication.shared.open(url)
            decisionHandler(.cancel)
            return
        }
    }
    decisionHandler(.allow)
}

URL Scheme を使用する

NAVERマップアプリの URL Schemeが提供するアクションについて説明します。このガイドで学習するアクションの使い方は、次の通りです。

参考

ルート検索(/route)とナビゲーション(/navigation)で使用する共通パラメータは、本記事のルート検索共通パラメータをご参照ください。

マップのメイン画面表示

NAVERマップアプリのメイン画面を表示します。

アクションパス

/map

パラメータ

パラメータ タイプ 必須有無 説明
lat double N マップの中心緯度
  • 入力値: 31.43~44.35
  • デフォルト値: アプリの既存ステータスを維持
lng double N マップの中心経度
  • 入力値: 122.37~132.00
  • デフォルト値: アプリの既存ステータスを維持
zoom double N マップのズームレベル
  • 入力値: 4~20
  • デフォルト値: アプリの既存ステータスを維持

ユースケース

マップアプリのメイン画面表示
以下は、入力パラメータなしでマップアプリのメイン画面を表示するユースケースです。

nmap://map?&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-map-no-parameter_ko

中心座標とズームレベルの反映
以下はマップの中心点を (37.4979502, 127.0276368)、ズームレベルを20に指定してマップアプリのメイン画面を表示するユースケースです。

nmap://map?lat=37.4979502&lng=127.0276368&zoom=20&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-map-parameter_ko

統合検索

検索キーワードに合ったマップ検索結果を表示します。

アクションパス

/search

パラメータ

パラメータ タイプ 必須有無 説明
query string Y 検索キーワード
  • 入力値: URLエンコードされた文字列

ユースケース

以下は、「江南駅」を検索キーワードにしてマップを検索するユースケースです。

nmap://search?query=%EA%B0%95%EB%82%A8%EC%97%AD&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-search-normal_ko

バス検索

検索キーワードに合ったバス検索結果を表示します。

アクションパス

/search/bus

パラメータ

パラメータ タイプ 必須有無 説明
query string Y バス番号
  • 入力値: URLエンコードされた文字列

ユースケース

以下は、222番バスを検索するユースケースです。

nmap://search/bus?query=222&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-search-bus_ko

マーカー表示

指定した座標にマーカーを表示します。

アクションパス

/place

パラメータ

パラメータ タイプ 必須有無 説明
lat double Y 緯度
  • 入力値: 31.43~44.35
lng double Y 経度
  • 入力値: 122.37~132.00
name string Y 名前
  • 入力値: URLエンコードされた文字列

ユースケース

以下は、(37.3677345,127.1083617)の位置に「京畿道 城南市 盆唐区 亭子洞」のマーカーを表示するユースケースです。

nmap://place?lat=37.3677345&lng=127.1083617&name=%EA%B2%BD%EA%B8%B0%EB%8F%84%20%EC%84%B1%EB%82%A8%EC%8B%9C%20%EB%B6%84%EB%8B%B9%EA%B5%AC%20%EC%A0%95%EC%9E%90%EB%8F%99&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-place_ko

公共交通ルート検索

公共交通ルート検索を実行します。

アクションパス

/route/public

パラメータ

ルート検索共通パラメータの項目をご参照ください。

ユースケース

以下は、ソウル大学校からオリンピック公園まで公共交通で行くルートを検索するユースケースです。

nmap://route/public?slat=37.4640070&slng=126.9522394&sname=%EC%84%9C%EC%9A%B8%EB%8C%80%ED%95%99%EA%B5%90&dlat=37.5209436&dlng=127.1230074&dname=%EC%98%AC%EB%A6%BC%ED%94%BD%EA%B3%B5%EC%9B%90&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-route-public_ko

自動車ルート検索

自動車ルート検索を実行します。

アクションパス

/route/car

パラメータ

ルート検索共通パラメータの項目をご参照ください。

ユースケース

ソウル大学校からオリンピック公園までの自動車ルート検索のユースケース
以下は、ソウル大学校からオリンピック公園までの自動車で行くルートを検索するユースケースです。

nmap://route/car?slat=37.4640070&slng=126.9522394&sname=%EC%84%9C%EC%9A%B8%EB%8C%80%ED%95%99%EA%B5%90&dlat=37.5209436&dlng=127.1230074&dname=%EC%98%AC%EB%A6%BC%ED%94%BD%EA%B3%B5%EC%9B%90&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-route-car-1_ko

経由地がある場合の自動車ルート検索のユースケース
以下は、グリーンファクトリーからソウル大学校を経由して城南市役所まで自動車で行くルートを検索するユースケースです。

nmap://route/car?slat=37.3595953&slng=127.1053971&sname=%EA%B7%B8%EB%A6%B0%ED%8C%A9%ED%86%A0%EB%A6%AC&secoords=37.359761,127.10527&dlng=127.1267772&dlat=37.4200267&dname=%EC%84%B1%EB%82%A8%EC%8B%9C%EC%B2%AD&decoords=37.4189564,127.1256827&v1lng=126.9522394&v1lat=37.464007&v1name=%20%EC%84%9C%EC%9A%B8%EB%8C%80%ED%95%99%EA%B5%90&v1ecoords=37.466358,126.948357&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-route-car-2_ko

徒歩ルート検索

徒歩ルート検索を実行します。

アクションパス

/route/walk

パラメータ

ルート検索共通パラメータの項目をご参照ください。

ユースケース

以下は、ソウル大学校から東園落星垈アパートまで徒歩で行くルートを検索するユースケースです。

nmap://route/walk?slat=37.4640070&slng=126.9522394&sname=%EC%84%9C%EC%9A%B8%EB%8C%80%ED%95%99%EA%B5%90&dlat=37.4764356&dlng=126.9618302&dname=%EB%8F%99%EC%9B%90%EB%82%99%EC%84%B1%EB%8C%80%EC%95%84%ED%8C%8C%ED%8A%B8&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-route-walk_ko

自転車ルート検索

自転車ルート検索を実行します。

アクションパス

/route/bicycle

パラメータ

ルート検索共通パラメータの項目をご参照ください。

ユースケース

以下は、ソウル大学校からオリンピック公園まで自転車で行くルートを検索するユースケースです。

nmap://route/bicycle?slat=37.4640070&slng=126.9522394&sname=%EC%84%9C%EC%9A%B8%EB%8C%80%ED%95%99%EA%B5%90&dlat=37.5209436&dlng=127.1230074&dname=%EC%98%AC%EB%A6%BC%ED%94%BD%EA%B3%B5%EC%9B%90&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-route-bicycle_ko

ナビゲーション

ナビゲーションルートを検索します。

アクションパス

/navigation

パラメータ

ルート検索共通パラメータの項目をご参照ください。

ユースケース

安全運転モードのナビゲーション
以下は、安全運転モードでナビゲーション画面を表示するユースケースです。

nmap://navigation?&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-navi-1_ko

現在地から目的地までのナビゲーション
以下は、ユーザーの現在地からオリンピック公園までのナビゲーションルートを検索するユースケースです。

nmap://navigation?dlat=37.5209436&dlng=127.1230074&dname=%EC%98%AC%EB%A6%BC%ED%94%BD%EA%B3%B5%EC%9B%90&appname=com.example.myapp

呼び出し結果は次の通りです。

url-scheme-navi-2_ko

ルート検索共通パラメータ

ルート検索(/route)とナビゲーション(/navigation)で使用する共通パラメータです。

パラメータ タイプ 必須有無 説明
slat double N 出発地の緯度
  • 入力値: 31.43~44.35
  • デフォルト値: ユーザーの現在地を使用
slng double N 出発地の経度
  • 入力値: 122.37~132.00
  • デフォルト値: ユーザーの現在地を使用
sname string N 出発地名
  • 入力値: URLエンコードされた文字列
  • デフォルト値: ユーザーの現在地を使用
dlat double Y 目的地の緯度
  • 入力値: 31.43~44.35
dlng double Y 目的地の経度
  • 入力値: 122.37~132.00
dname string N 目的地名
  • 入力値: URLエンコードされた文字列
  • デフォルト値: 目的地の住所を表示
v1lat double N 経由地1の緯度
  • 入力値: 31.43~44.35
  • デフォルト値: 経由地なし
v1lng double N 経由地1の経度
  • 入力値: 122.37~132.00
  • デフォルト値: 経由地なし
v1name string N 経由地1の名前
  • 入力値: URLエンコードされた文字列
  • デフォルト値: 経由地なし
v2lat double N 経由地2の緯度
  • 入力値: 31.43~44.35
  • デフォルト値: 経由地なし
v2lng double N 経由地2の経度
  • 入力値: 122.37~132.00
  • デフォルト値: 経由地なし
v2name string N 経由地2の名前
  • 入力値: URLエンコードされた文字列
  • デフォルト値: 経由地なし
v3lat double N 経由地3の緯度
  • 入力値: 31.43~44.35
  • デフォルト値: 経由地なし
v3lng double N 経由地3の経度
  • 入力値: 122.37~132.00
  • デフォルト値: 経由地なし
v3name string N 経由地3の名前
  • 入力値: URLエンコードされた文字列
  • デフォルト値: 経由地なし
v4lat double N 経由地4の緯度
  • 入力値: 31.43~44.35
  • デフォルト値: 経由地なし
v4lng double N 経由地4の経度
  • 入力値: 122.37~132.00
  • デフォルト値: 経由地なし
v4name string N 経由地4の名前
  • 入力値: URLエンコードされた文字列
  • デフォルト値: 経由地なし
v5lat double N 経由地5の緯度
  • 入力値: 31.43~44.35
  • デフォルト値: 経由地なし
v5lng double N 経由地5の経度
  • 入力値: 122.37~132.00
  • デフォルト値: 経由地なし
v5name string N 経由地5の名前
  • 入力値: URLエンコードされた文字列
  • デフォルト値: 経由地なし