从 WebView 中响应本机深层链接

我正在使用带有 React Navigation 和 react-native-deep-link 和 react-native-webview 包的 React Native

。

我的应用程序使用深层链接来访问应用程序的不同屏幕，并且在 iPhone 上打开深层链接工作正常，除了在 WebView 中，如果我按下链接，则没有任何反应。该应用程序甚至在单击链接时都没有反应，没有控制台警告消息，也没有。

如果我在iPhone上使用Safari，这些功能可以正常工作，但不能在WebView中工作。

这是网络视图代码：

class BankID extends React.Component {
  render() {
      return (
        <WebView
          style={{ flex: 1 }}
          source={{ uri: 'https://URL/file.html' }}
        />
      );
  }
}
export default BankID;

文件.html：

<html>
<body>
<a href="test://1234">App-Link</a>
</body>
</html>

从应用程序中.js我得到了 github 存储库中指示的深度链接组件：

componentDidMount() {
  DeepLinking.addScheme('test://');
  Linking.addEventListener('url', this.handleUrl);
    Linking.getInitialURL().then((url) => {
      if (url) {
        Linking.openURL(url);
      }
    }).catch(err => console.error('An error occurred', err));
    DeepLinking.addRoute('/:id', ({ id }) => {
      this.setState({ roomKey: id.toString() });
      if (this.vidyoConnector) {
        this.callButtonPressHandler();
      }
    });
 }
  handleUrl = ({ url }) => {
    Linking.canOpenURL(url).then((supported) => {
      if (supported) {
        DeepLinking.evaluateUrl(url);
      }
    }).catch((error) => {
      console.warn('handleUrl failed with the following reason: ', error);
    });
  }

任何帮助将不胜感激。谢谢。

这对我有用：

在Web视图中，我添加了带有函数的ShouldStartLoadWithRequest。

  <WebView
    other
    stuff
    onShouldStartLoadWithRequest={this.openExternalLink}
  />

然后是函数：

  openExternalLink= (req) => {
    const isHTTPS = req.url.search('https://') !== -1;
        if (isHTTPS) {
          return true;
        } else {
          if (req.url.startsWith("test://")) {
            this.props.navigation.navigate('Home');
          } 
          return false;
        }
      }

不必在应用程序中更改任何内容.js

我在打开外部 url 时onNavigationStateChange留下不可点击/可点击页面的问题，所以我使用了，现在它运行良好。

        <WebView
          ref={webView}
          source={{ uri: uri }}
          startInLoadingState // ignore warning
          onMessage={handleOnMessage}
          javaScriptEnabled
          onShouldStartLoadWithRequest={handleOnShouldStartLoadWithRequest}
        />

  const handleOnShouldStartLoadWithRequest = (event) => {
    const hostname = extractHostname(event.url)
    if (event.url && ![BASE_DOMAIN, APPLEID_DOMAIN].includes(hostname)) {
      Linking.openURL(event.url)
      return false
    } else {
      return true
    }
  }

相关内容

最新更新

热门标签：