在没有 React-Native 或 React-Navigation 的情况下在 React 中进行深度链接

Question

我有一个来自客户的请求，要求在我们的 React 应用程序中实现深度链接，点击链接会将它们直接带到已安装的应用程序中（可能到某个点，但还不确定）。

据我了解，react-native 和 react-navigation 都将此作为它们提供的“链接”中的功能集的一部分来处理。 然而，仅仅为了深度链接而导入一个框架似乎太过分了（也许不是）。

在谷歌搜索之后，我只能真正找到对 react-native 或 react-navigation 上的深层链接的引用。

我最好的行动方针是什么？

Answer 1

让我们先了解一些基础知识，然后就清楚了。

在现代 SPA 中，比如 React，SPA 自己处理导航是很常见的。 您需要使用浏览器的历史 API。 这是因为你的 SPA 只是一个带有一堆 js 代码的 index.html，所以它有点虚拟，每个页面都是由你的应用程序构建的。 为了不重新发明轮子，使用一些库更容易，比如react-router-dom 。

但是一切都按预期进行，并且您已经部署了您的应用程序。 当用户想要获取一些深层页面时，例如https://my-awesome-app.com/deep/page/1 ，浏览器只会向服务器发送请求，询问：“请服务器，给我一个页面1.html，在文件夹页面，在文件夹深处”。 但是服务器没有那个文件，因为它实际上只有一个 index.html，因为它是一个 SPA 应用程序。 然后我们需要告诉服务器将所有深层路由重写为索引 html，这是我在 Netlify 上托管的应用程序的示例：

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

当用户请求该页面时，服务器会将该请求“重定向”到 index.html，我的 react-router-dom 将根据该路径确定要呈现哪个“PageComponent”。

因此，您可以自己在您的应用程序中实现路由，可能使用浏览器的 History API，但我想使用库可能更容易。 但这是你的电话。

另一方面，如果您的应用程序不是 SPA，则情况可能会有所不同，因为 NextJS 中的路由是在框架本身中实现的，如果使用深度链接，则需要根据应用程序的部署方式进行不同的设置。

Answer 2

深度链接主要由 Apple 和 Google 服务器端处理

https://www.adjust.com/blog/dive-into-deeplinking/

React-native 为移动应用程序中的深层链接提供了扩展功能，但普通的 Web 应用程序不需要在那里实现它。 使用通用链接或 Google 特定链接作为 Web 应用程序中的标准链接以启用深层链接