Fitbit OAuth2.0 redirect_uri 和原生反应

Question

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

Answer 1

你问的是deep linking。

要从浏览器打开您的本机应用程序：

您的本机应用需要定义一个 URL scheme，其他应用 可以用来定位它。
您基于浏览器的代码需要使用您应用的 scheme.

而且，最有可能的是：

您的应用程序需要一个用于深度 link 的侦听器。如果您不编写侦听器，您的应用程序将打开，但您无法将信息从基于浏览器的代码传递到应用程序。

这是一个粗略的例子，作为起点。我鼓励您仔细阅读文档，因为 deep-linking 比乍一看要复杂得多。 :)

React Native

首先，为您的应用创建 my-excellent-app:// 方案 as explained here. If you're using 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 这样的第三方也处理了很多这样的事情，甚至更多。

Fitbit OAuth2.0 redirect_uri 和原生反应

Fitbit OAuth2.0 redirect_uri and react native

react-native

oauth-2.0

fitbit

React Native

网络资料