Fitbit OAuth2.0 redirect_uri 和本机反应 反应原生网络资料

如何解决Fitbit OAuth2.0 redirect_uri 和本机反应 反应原生网络资料

我在 react native 和我为 redirect_uri 设置的端点之间遇到了一个问题。对于流程，当前用户从应用程序转到出现 fitbit 授权页面的浏览器。到现在为止还挺好。用户选择想要允许的权限，从这里redirect_uri 指向一个将信息保存到数据库中的快速端点。在这一步之后，我想将用户重定向回 React Native 应用程序以继续，而不是它只显示来自移动浏览器端点的成功消息。端点完成处理后，如何将用户重定向回应用程序？

解决方法

您要问的是deep linking。

要从浏览器打开您的原生应用：

1. 您的原生应用需要定义一个网址 scheme，其他应用可以使用该网址来定位它。
2. 您的基于浏览器的代码需要使用您应用的 scheme 重定向到一个网址。

而且，很可能：

3. 您的应用需要一个深层链接侦听器。如果您不编写侦听器，您的应用将打开，但您无法将信息从基于浏览器的代码传递到应用中。

这是一个粗略的例子，作为起点。我鼓励您彻底阅读文档，因为深层链接比乍一看要复杂得多。 :)

反应原生

首先，为您的应用 as explained here 创建 my-excellent-app:// 方案。如果您使用 Expo，这会变得更加简单。

然后，在生命周期中尽早添加侦听器。就像大多数文档解释一样 - 通常在 App.js 或 index.js 的最顶层组件中。

import { Linking } from 'react-native';
import URL from 'url-parse';

// Make sure to only add this listener once!
// Adding it more than once will trigger the handler more than once. ;)
Linking.addEventListener('url',({ url }) => {
  const deeplink = URL(url,true);
  console.log(deeplink.query);
});

网络资料

我不确定您使用的是哪种技术栈，但概念很简单：在服务器上执行您需要执行的任何操作，然后将浏览器重定向回您应用的自定义方案。

在 Express 中，这将类似于：

res.redirect('my-excellent-app://myCustomLink?other=data&using=UrlParamsGoesHere');

最后，像 Branch 这样的第三方也可以处理很多这样的事情，甚至更多。