React Native 下面Android 下的Deep link 配置

2022-06-12 17:01:43 阅读：284 来源： 互联网

标签：http app Deep React setting link 2.2 android 8245

RN下面Android平台下的DeepLink 的配置与使用

AndroidManifest.xml的配置

路径： android/app/src/main/AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.payment">
  <uses-permission android:name="android.permission.INTERNET" />
  <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:theme="@style/AppTheme">
    <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize"
        android:exported="true">
        <!-- autoVerify 需要网页配置文件配合来达到浏览器打开app效果 -->
      <intent-filter android:autoVerify="true">      
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
      </intent-filter>
      <!-- 下面这个配置项是用于配置路由，注意schema 那个data, -->
      <!-- 10.0.2.2 对应的是windows 机器，在android emulator中，我们的开发机器就是这个ip,相当于localhost -->
      <!-- 配置了三个路由 myPayment://10.0.2.2:8245/xxx -->
      <!-- https://10.0.2.2:8246/xxx -->
      <!-- http://10.0.2.2:8245/xxx -->
      <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="myPayment"/>
        <data android:scheme="https" android:host="10.0.2.2:8246"/>
        <data android:scheme="http" android:host="10.0.2.2:8245"/>
      </intent-filter>
    </activity>
  </application>
</manifest>

由于开启了android:autoVerify="true",需要一个站点来提供app的签名认证，完整链接,

具体步骤如下：

keytool -list -v -keystore .\android\app\debug.keystore 产生app的签名，注意其中的SHA256这个hash。.\android\app\debug.keystore,这个路径是相对于项目目录而言的。这个里面有个坑，需要密码。密码是android,
copy 其中的 SHA256签名，放入assetlinks.json 文件中，内容如下;如果copy下面文件，记得删除注释。

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
    "namespace": "android_app",
    "package_name": "com.payment",  // 这个是你app的名字，android/app/build.gradle 中的defaultConfig, applicationId
    "sha256_cert_fingerprints":
    ["FA:C6:17:45:DC:09:03:78:6F:B9:ED:E6:2A:96:2B:39:9F:73:48:F0:BB:6F:89:9B:83:32:66:75:91:03:3B:9C"]  // 这个第一步中的SHA256
  }
}]

建立一个web 站点域名为http://localhost:8245 https://localhost:8246, 在http://localhost:8245/.well-know/assetlinks.json 放置第二步的配置项。

定义linking 来响应接受上面配置的路由参数，完整链接

代码示例

const config = {
  screens: {
    approval_setting: 'setting',// key screen 名字，value: 我们需要的路由,例如： http://10.0.2.2:8245/setting 将对应approval_setting screen
    my_approvals: 'myapprovals',
    submit_invoice: 'invoice',
  }
};
const linking = {
  prefixes: ['myPayment://10.0.2.2:8245', 'http://10.0.2.2:8245','https://10.0.2.2:8246'],
  config,
};

function App(){
  return (
    <NavigationContainer linking={linking}>
        xxx
    </NavigationContainer>
  )
}

测试link

小插曲，我一开始直接在浏览器中输入url: http://10.0.2.2:8245/setting,发现不起作用，实际上需要开发者工具，推荐 uri-schema这个npm 包，
直接运行npx uri-schema open "http://10.0.2.2:8245/setting" --android就可以打开这个app.

标签：http,app,Deep,React,setting,link,2.2,android,8245
来源： https://www.cnblogs.com/kongshu-612/p/16368305.html