webview - React Native 的 Webview 组件中的身份验证质询

Question

我正在尝试在需要凭据的 react native webview 中加载 URL。通常，当我们在 Safari 和 Chrome 等浏览器中打开此 URL 时，它会给我们一个弹出窗口来输入凭据。不确定如何在 React-Native 中处理它？

Answer 1

我们需要对 React Native 应用程序进行 LinkedIn 身份验证，我们找不到使用 WebView 的方法。成分。

此 5 月 很有可能，但是，我将重点介绍我们提出的解决方案。这些步骤适用于 iOS React Native 应用程序，Android 的步骤会有所不同，但概念是相同的。这也确实需要一些服务器配置。

我们创建了一个 URL 类型。在 XCode 中，选择您的项目并单击 Info标签。滚动到底部查看 URL 类型 .填写 identifier和 URL Schemes .记住您为 URL Schemes 设置的内容.对于这个例子，我们将使用 myscheme .

当应用程序打开时，我们使用 Linking在 Safari 中打开 URL。

Linking.openURL('https://foo.bar');

然后用户可以通过网站登录，登录后，您可以将您的用户重定向回。

myscheme://name=Dan

myscheme匹配 URL Scheme您在 Xcode 中输入。只要您安装了应用程序并且方案匹配，您的应用程序就会打开。

您可以在 :// 之后添加任何信息负载.

在您的 React 应用程序中，您可以注册

componentWillMount() {
  Linking.addEventListener('url', this.handleOpenURL);
}

componentWillUnmount() {
  Linking.removeEventListener('url', this.handleOpenURL);
}

handleOpenURL = (event) => {
  const { url } = event;
  if (url.startsWith('myscheme://')) {
    // do something with your data.
  }
};