Linking
Linking
は、アプリへの着信リンクと発信リンクの両方とやり取りするための一般的なインターフェースを提供します。
すべてのリンク(URL)にはURLスキームがあります。一部のウェブサイトはhttps://
またはhttp://
で始まり、http
がURLスキームです。ここでは簡単にスキームと呼びます。
https
に加えて、mailto
スキームにも精通しているでしょう。mailtoスキームのリンクを開くと、オペレーティングシステムはインストールされているメールアプリケーションを開きます。同様に、電話をかけるためのスキームやSMSを送信するためのスキームもあります。組み込みのURLスキームについては、以下で詳しく説明します。
mailtoスキームを使用するのと同じように、カスタムURLスキームを使用して他のアプリケーションにリンクすることも可能です。たとえば、Slackからマジックリンクメールを受け取ると、「Slackを起動」ボタンは、次のようなhrefを持つアンカータグです。slack://secret/magic-login/other-secret
。Slackの場合と同様に、カスタムスキームを処理したいことをオペレーティングシステムに伝えることができます。Slackアプリが開くと、それを開くために使用されたURLを受け取ります。これは、多くの場合、ディープリンクと呼ばれます。アプリへのディープリンクの取得方法について詳しくは後述します。
カスタムURLスキームは、モバイルでアプリケーションを開く唯一の方法ではありません。メール内のリンクでカスタムURLスキームを使用すると、デスクトップではリンクが壊れてしまうため、使用すべきではありません。代わりに、https://www.myapp.io/records/1234546
などの通常のhttps
リンクを使用します。モバイルでは、そのリンクでアプリを開きたいです。Androidではこれをディープリンク(iOSではユニバーサルリンク)と呼びます。
組み込みURLスキーム
はじめに述べたように、すべてのプラットフォームに存在するコア機能用のいくつかのURLスキームがあります。以下は網羅的なリストではありませんが、最も一般的に使用されるスキームを網羅しています。
スキーム | 説明 | iOS | Android |
---|---|---|---|
mailto | メールアプリを開きます。例: mailto: support@expo.io | ✅ | ✅ |
tel | 電話アプリを開きます。例: tel:+123456789 | ✅ | ✅ |
sms | SMSアプリを開きます。例: sms:+123456789 | ✅ | ✅ |
https / http | Webブラウザアプリを開きます。例: https://expo.io | ✅ | ✅ |
ディープリンクの有効化
アプリでディープリンクを有効にするには、以下のガイドを参照してください。
- Android
- iOS
Androidでディープリンクのサポートを追加する方法については、アプリコンテンツのディープリンクの有効化 - ディープリンクのインテントフィルターの追加を参照してください。
既存のMainActivityインスタンスでインテントを受け取る場合は、AndroidManifest.xml
でMainActivityのlaunchMode
をsingleTask
に設定できます。<activity>
ドキュメントで詳細情報を確認してください。
<activity
android:name=".MainActivity"
android:launchMode="singleTask">
注記: iOSでは、手順3で説明されているようにこちらに記載されているように、
LinkingIOS
フォルダをヘッダー検索パスに追加する必要があります。アプリの実行中に着信アプリリンクをリッスンすることもしたい場合は、次の行を*AppDelegate.m
に追加する必要があります。
// iOS 9.x or newer
#import <React/RCTLinkingManager.h>
- (BOOL)application:(UIApplication *)application
openURL:(NSURL *)url
options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
{
return [RCTLinkingManager application:application openURL:url options:options];
}
iOS 8.x以前をターゲットにしている場合は、代わりに次のコードを使用できます。
// iOS 8.x or older
#import <React/RCTLinkingManager.h>
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url
sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
return [RCTLinkingManager application:application openURL:url
sourceApplication:sourceApplication annotation:annotation];
}
ユニバーサルリンクを使用しているアプリの場合、次のコードも追加する必要があります。
- (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity
restorationHandler:(nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler
{
return [RCTLinkingManager application:application
continueUserActivity:userActivity
restorationHandler:restorationHandler];
}
ディープリンクの処理
アプリを開くURLを処理するには、2つの方法があります。
1. アプリが既に開いていて、アプリがフォアグラウンドにあり、Linking 'url'イベントが発生した場合
これらのイベントはLinking.addEventListener('url', callback)
で処理できます。リンクされたURLを使用してcallback({url})
を呼び出します。
2. アプリがまだ開いていない場合、アプリが開き、urlがinitialURLとして渡されます
これらのイベントはLinking.getInitialURL()
で処理できます。これは、URLが存在する場合は、そのURLに解決されるPromiseを返します。
例
リンクとディープリンク(ユニバーサルリンク)を開く
- TypeScript
- JavaScript
カスタム設定を開く
- TypeScript
- JavaScript
ディープリンクを取得する
- TypeScript
- JavaScript
インテントを送信する(Android)
- TypeScript
- JavaScript
参照
メソッド
addEventListener()
static addEventListener(
type: 'url',
handler: (event: {url: string}) => void,
): EmitterSubscription;
url
イベントタイプをリッスンし、ハンドラーを提供することで、Linkingの変更に対するハンドラーを追加します。
canOpenURL()
static canOpenURL(url: string): Promise<boolean>;
インストールされているアプリが特定のURLを処理できるかどうかを判断します。
このメソッドはPromise
オブジェクトを返します。指定されたURLを処理できるかどうかが決定されると、Promiseが解決され、最初の引数に開くことができるかどうかが渡されます。
URLを開くことができるかどうかを確認することが不可能な場合、またはAndroid 11(SDK 30)をターゲットにしていてAndroidManifest.xml
に関連するインテントクエリを指定していない場合は、AndroidでPromise
は拒否されます。同様に、iOSでは、Info.plist
内のLSApplicationQueriesSchemes
キーに特定のスキームを追加していない場合は、Promiseは拒否されます(下記参照)。
パラメーター
名前 | 型 | 説明 |
---|---|---|
url 必須 | 文字列 | 開くURL。 |
Web URLの場合、プロトコル(
"http://"
、"https://"
)を適切に設定する必要があります!
このメソッドはiOS 9以降に制限があります。Apple公式ドキュメントから
- アプリが以前のバージョンのiOSにリンクされているが、iOS 9.0以降で実行されている場合、このメソッドを最大50回呼び出すことができます。その制限に達すると、その後の呼び出しは常に
false
に解決されます。ユーザーがアプリを再インストールまたはアップグレードすると、iOSは制限をリセットします。iOS 9以降では、アプリは
Info.plist
内にLSApplicationQueriesSchemes
キーを提供する必要もあります。そうでない場合、canOpenURL()
は常にfalse
に解決されます。
Android 11(SDK 30)をターゲットにしている場合は、処理するスキームのインテントを
AndroidManifest.xml
で指定する必要があります。一般的なインテントのリストはこちらにあります。たとえば、
https
スキームを処理するには、マニフェストに次のものを追加する必要があります。<manifest ...>
<queries>
<intent>
<action android:name="android.intent.action.VIEW" />
<data android:scheme="https"/>
</intent>
</queries>
</manifest>
getInitialURL()
static getInitialURL(): Promise<string | null>;
アプリの起動がアプリリンクによってトリガーされた場合、リンクURLが返されます。そうでない場合はnull
が返されます。
Androidでディープリンクをサポートするには、https://developer.android.com/training/app-indexing/deep-linking.html#handling-intentsを参照してください。
リモートJSデバッグがアクティブな場合、getInitialURLは
null
を返す可能性があります。確実に渡されるように、デバッガーを無効にしてください。
openSettings()
static openSettings(): Promise<void>;
設定アプリを開き、アプリにカスタム設定がある場合は表示します。
openURL()
static openURL(url: string): Promise<any>;
インストールされているアプリのいずれかを使用して、指定されたurl
を開こうとします。
場所(例:Androidでは「geo:37.484847,-122.148386」、iOSでは「https://maps.apple.com/?ll=37.484847,-122.148386」)、連絡先、またはインストールされているアプリで開くことができるその他のURLを使用できます。
このメソッドはPromise
オブジェクトを返します。ユーザーが開くダイアログを承認した場合、またはURLが自動的に開かれた場合、Promiseは解決されます。ユーザーが開くダイアログをキャンセルした場合、またはそのURLに対応する登録済みアプリケーションがない場合、Promiseは拒否されます。
パラメーター
名前 | 型 | 説明 |
---|---|---|
url 必須 | 文字列 | 開くURL。 |
指定されたURLを開く方法がシステムに認識されていない場合、このメソッドは失敗します。http(s)以外のURLを渡す場合は、事前に
canOpenURL()
を確認することをお勧めします。
Web URLの場合、プロトコル(
"http://"
、"https://"
)を適切に設定する必要があります!
このメソッドはシミュレーターでは異なる動作をする可能性があります。例えば、
"tel:"
リンクは、ダイヤラーアプリにアクセスできないため、iOSシミュレーターでは処理できません。
sendIntent()
Android
static sendIntent(
action: string,
extras?: Array<{key: string; value: string | number | boolean}>,
): Promise<void>;
追加情報付きでAndroid Intentを起動します。
パラメーター
名前 | 型 |
---|---|
アクション 必須 | 文字列 |
追加情報 | Array<{key: string, value: string | number | boolean}> |