android - 在 React Native 中使用其他域重定向 WebView

Question

我正在尝试将链接从另一个域重定向到设备的默认浏览器。

例如:

• 如果链接是http://domain.io , 停留在 WebView 中；
• 如果链接是 http://domain.io/page , 我们留在 WebView 中；
• 如果链接是 http://mylink.io/ ，我们将用户重定向到设备，然后我们离开 WebView。

我试了很多东西，还是不行。我考虑将 onNavigationStateChange 与链接一起使用。

感谢您的帮助。

import React from 'react';
import { StyleSheet, View, WebView } from 'react-native';
import { Constants } from 'expo';


export default class App extends React.Component {

  render() {
    return (
      <View style={styles.container}>
        <View style={styles.statusBar} />
        <WebView
          source={{uri: 'https://example.com'}}
          renderError={() => alert('Merci de vérifier votre connexion Internet', 'Internet non disponible')}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  statusBar: {
    backgroundColor: "#1D3B57",
    height: Constants.statusBarHeight,
  }
});

Answer 1

解决方案一:

onNavigationStateChange(e)
{
  if(e.url !== this.state.oldUrl)
  {
    // If url changed
    if(/youtube.com/.test(e.url)) // RegExp
    {
        this.refs.WEBVIEW_REF.goBack()
        Linking.canOpenURL(e.url).then(supported => {
          if (supported) return Linking.openURL(e.url)
        })
    }
    this.setState({ oldUrl: e.url })
  }
}

解决方案 2:

考虑调查 this PR将原生 shouldOverrideUrlLoading 方法暴露给 JS。执行此操作可能有点复杂。