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

Question

我们目前将我们的应用程序上传到苹果商店并得到以下答案：

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

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

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

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

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

但是这个回购自 2 年以来就没有得到维护。

有没有人可以让我更清楚地说明审稿人对这个答案的意思？我可以使用

WebBrowser.openBrowserAsync('url')

达到他们想要的？

此致

Answer 1

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

审阅者希望您通过让您的用户留在您的应用程序中，同时仍然为他们提供 safari 的所有功能来提供更好的用户体验。

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

即使您指向的库正是这样做的，但它不再被维护，它只适用于 iOS，所以我会使用更现代的东西，它也适用于 Android：

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

Answer 2

expo-web-browser提供对系统 Web 浏览器的访问并支持处理重定向。在 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>
  );
}