Реагируйте на собственную глубокую ссылку из WebView - PullRequest
0 голосов
/ 18 января 2019

Я использую React Native с React Navigation и response-native-deep-linking и response-native-webview пакетов.

Мое приложение использует глубокие ссылки для доступа к различным экранам приложения, и оно прекрасно работает, чтобы открыть глубокую ссылку на iPhone, кроме как в WebView, где ничего не происходит, если я нажимаю на ссылку. Приложение даже не реагирует на нажатие ссылки, сообщения console.warn или чего-либо еще.

Если вместо этого я использую Safari на iPhone, функции работают просто отлично, но не из WebView.

Это код WebView:

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

file.html:

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

А из App.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);
    });
  }

Любая помощь будет принята с благодарностью. Спасибо.

1 Ответ

0 голосов
/ 25 января 2019

Это сработало для меня:

в веб-просмотре я добавил onShouldStartLoadWithRequest с функцией.

  <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;
        }
      }

Не нужно ничего менять в App.js

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...