在 React Native 中实现 Safari 视图控制器答案

【问题标题】：Implement Safari View Controller in React Native在 React Native 中实现 Safari 视图控制器
【发布时间】：2019-10-22 12:04:09
【问题描述】：

我们目前将我们的应用上传到苹果商店，得到以下答复：

我们建议实现 Safari View Controller API 以显示您的应用程序中的网页内容。 Safari 视图控制器允许显示 URL 并检查嵌入式证书应用程序中的浏览器，以便客户可以验证网页 URL 和 SSL 证书以确认他们正在输入他们的登录凭据进入合法页面。

目前我正在使用此代码从我们的应用程序打开网站

Linking.openURL('here-goes-the-url')

所以我有点迷失苹果的这个答案究竟意味着什么。我应该在我的应用程序中使用 WebView 来显示网站内容吗？我试过了，但我看不到苹果评论中提到的任何 url 或证书。

到目前为止我发现的是这样的： https://www.npmjs.com/package/react-native-safari-view-controller

但是这个 repo 已经 2 年没有维护了。

有没有人可以让我更清楚评论者对这个答案的意思？我可以用吗

WebBrowser.openBrowserAsync('url')

实现他们想要的？

最好的问候

【问题讨论】：

标签： react-native sfsafariviewcontroller

【解决方案1】：

所以现在，通过使用Linking.openURL...，您将用户发送到外部浏览器（iOS 上的 safari）。

审阅者希望您提供更好的用户体验，让您的用户继续使用您的应用程序，同时仍为他们提供 safari 的所有功能。

为此，您必须使用称为 Safari View Controller（在 iOS 上）的东西，这基本上就像在您的应用中在中打开 safari。

尽管 library you pointed to 确实做到了这一点，但它不再被维护，它只适用于 iOS，所以我会使用更现代的东西，也适用于 Android：

https://github.com/proyecto26/react-native-inappbrowser

【讨论】：

感谢您的回答，非常感谢。好吧，与此同时，我使用了 expo (docs.expo.io/versions/latest/sdk/webbrowser) 提供的 WebBrowser.openBrowserAsync(url)，并且在文档中它说：“在 iOS 上，它使用 SFSafariViewController”并且苹果继续拒绝该应用程序。但最困扰我的是他们希望我使用应用内浏览器，这样当 safari 不以任何方式支持时，用户就可以看到 ssl 证书。好吧，我们与苹果公司有约会，让我们看看他们说什么;-)
@jhen 他们说了什么？

【解决方案2】：

expo-web-browser 提供对系统网络浏览器的访问并支持处理重定向。在 iOS 上，它使用 SFSafariViewController 或 SFAuthenticationSession，具体取决于您调用的方法，而在 Android 上，它使用 ChromeCustomTabs。从 iOS 11 开始，SFSafariViewController 不再与 Safari 共享 cookie，因此如果您使用 WebBrowser 进行身份验证，您将需要使用 WebBrowser.openAuthSessionAsync，如果您只想打开网页（例如您的应用隐私政策），然后使用 WebBrowser.openBrowserAsync

https://docs.expo.io/versions/latest/sdk/webbrowser/

参考示例代码：-

export default function App() {
  const [result, setResult] = useState(null);

  const _handlePressButtonAsync = async () => {
    let result = await WebBrowser.openBrowserAsync('https://expo.io');
    setResult(result);
  };
  return (
    <View style={styles.container}>
      <Button title="Open WebBrowser" onPress={_handlePressButtonAsync} />
      <Text>{result && JSON.stringify(result)}</Text>
    </View>
  );
}

【讨论】：