在反应移动应用程序上设置应用程序链接

Question

Im actually making a mobile app and i'd to setup links to open it when you click on it. I tried to setup app links but i doesn't seem to work... Here's my code:

Manifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.didierurban.testLenny">
    ...
  <activity
    android:name="MainActivity" android:label="@string/app_name" android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.App.SplashScreen" android:screenOrientation="portrait">
    ...
      <intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
        <data android:scheme="https" android:host="example.net" />
      </intent-filter>
    </activity>
  </application>
</manifest>

My assetlink.json (on https://example.net/.well-known/assetlinks.json )

// 20210407190840
// https://lenny-girardot.fr/.well-known/assetlinks.json

[
  {
    "relation": [
      "delegate_permission/common.handle_all_urls"
    ],
    "target": {
      "namespace": "android_app",
      "package_name": "com.didierurban.testLenny",
      "sha256_cert_fingerprints": [
        "D4:DC:31:60:E9:B2:3F:2B:DF:23:33:31:49:D3:10:9F:3C:3A:6F:E6:1D:41:6E:DB:17:A3:3E:DD:1C:9C:6A:46"
      ]
    }
  }
]

app.json

{
  "expo": {
    "scheme": "...",
    "name": "...",
    "slug": "...",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true,
      "bundleIdentifier": "..."
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/adaptive-icon.png",
        "backgroundColor": "#FFFFFF"
      },
      "package": "..."
    },
    "web": {
      "favicon": "./assets/favicon.png"
    }
  }
}

If app links are not working with react, what can i setup to make it work? I also tried to use https://www.npmjs.com/package/node-deeplink but it seems outdated.

Thank you

Answer 1

on expo, you first need to specify a scheme in your app.json . eg myawesomeapp .

your manifest file should also have the same scheme like this

<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.didierurban.testLenny">
    ...
  <activity
    android:name="MainActivity" android:label="@string/app_name" android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.App.SplashScreen" android:screenOrientation="portrait">
    ...
      <intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
        <data android:scheme="myawesomeapp" />
      </intent-filter>
    </activity>
  </application>
</manifest>

on ios, add it to info.plist here

<key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>myawesomeapp</string>
            </array>
        </dict>
    </array>

you can then open links to your app using the url myawesomeapp://

you can also checkout this library for linking to other applications from your react native app

For more info on deep linking in expo, checkout the docs here