Ios 打开应用程序外部的react native expo应用程序外部链接_Ios_React Native_Expo

Ios 打开应用程序外部的react native expo应用程序外部链接

ios react-native

Ios 打开应用程序外部的react native expo应用程序外部链接,ios,react-native,expo,Ios,React Native,Expo,我正在使用以下代码。苹果不高兴的是，所有的外部链接都在应用程序中打开。我应该如何修改下面的代码，以便在outisde app safari中而不是在app safari中打开外部链接我的App.js如下： import { StatusBar } from 'expo-status-bar'; import React, { useState, useRef } from 'react' import {ActivityIndicator, Platform, TouchableOpacit

我正在使用以下代码。苹果不高兴的是，所有的外部链接都在应用程序中打开。我应该如何修改下面的代码，以便在outisde app safari中而不是在app safari中打开外部链接

我的

App.js

如下：

import { StatusBar } from 'expo-status-bar';
import React, { useState, useRef } from 'react'
import {ActivityIndicator, Platform,  TouchableOpacity, Text, SafeAreaView, StyleSheet, View} from "react-native";
import { WebView } from 'react-native-webview';
import { NavigationContainer } from '@react-navigation/native';
import { Ionicons } from '@expo/vector-icons'
import Constants from 'expo-constants'
const App = () => {
  const [canGoBack, setCanGoBack] = useState(false)
  const [canGoForward, setCanGoForward] = useState(false)
  const [currentUrl, setCurrentUrl] = useState('')
  const webviewRef = useRef(null)
  backButtonHandler = () => {
    if (webviewRef.current) webviewRef.current.goBack()
  }
  
  frontButtonHandler = () => {
    if (webviewRef.current) webviewRef.current.goForward()
  }

  return (
    <>
      <StatusBar barStyle='dark-content' />
      <View style={styles.flexContainer}>
        <WebView 
        userAgent="Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.193 Mobile Safari/537.36"
        source={{ uri: 'https://www.google.co.in/search?q=restaurants+nearby&ct=ifl&cad=2:hungry&ei=IWHsX_aDGJK0swXew5HgBw&ved=0ahUKEwi2mN_oyfXtAhUS2qwKHd5hBHwQnRsIDg&rct=j' }}
        mixedContentMode = "compatibility"
          ref={webviewRef}
          onNavigationStateChange={navState => {
            setCanGoBack(navState.canGoBack)
            setCanGoForward(navState.canGoForward)
            setCurrentUrl(navState.url)
          }}
        />
        <View style={styles.tabBarContainer}>
          <TouchableOpacity onPress={backButtonHandler}>
            <Ionicons name="ios-arrow-back" size={32} color="white" />
          </TouchableOpacity>
          <TouchableOpacity onPress={frontButtonHandler}>
            <Ionicons name="ios-arrow-forward" size={32} color="white" />
          </TouchableOpacity>
        </View>
      </View>
    </>
  )
}

const styles = StyleSheet.create({
  flexContainer: {
    flex: 1,
    paddingTop:Constants.statusBarHeight
  },
  tabBarContainer: {
    padding: 10,
    flexDirection: 'row',
    justifyContent: 'space-around',
    backgroundColor: '#000000'
  },
  button: {
    color: 'white',
    fontSize: 20
  }
})

export default App

从“世博会状态栏”导入{StatusBar}；
从“React”导入React，{useState，useRef}
从“react native”导入{ActivityIndicator，Platform，TouchableOpacity，Text，SafeAreaView，StyleSheet，View}；
从“react native WebView”导入{WebView}；
从'@react-navigation/native'导入{NavigationContainer}；
从“@expo/vector icons”导入{Ionicons}
从“expo常量”导入常量
常量应用=（）=>{
const[canGoBack，setCanGoBack]=useState（false）
const[canGoForward，setCanGoForward]=useState（false）
const[currentUrl，setCurrentUrl]=useState（“”）
const webviewRef=useRef（空）
backButtonHandler=（）=>{
if（webviewRef.current）webviewRef.current.goBack（）
}
frontButtonHandler=（）=>{
if（webviewRef.current）webviewRef.current.goForward（）
}
返回(
{
setCanGoBack（navState.canGoBack）
setCanGoForward（导航状态。canGoForward）
setCurrentUrl（navState.url）
}}
/>
)
}
const styles=StyleSheet.create({
flexContainer：{
弹性：1，
paddingTop:Constants.statusBarHeight
},
tabBarContainer：{
填充：10，
flexDirection:'行'，
为内容辩护：“周围的空间”，
背景颜色：'#000000'
},
按钮：{
颜色：'白色'，
尺寸：20
}
})
导出默认应用程序

编辑：请提供上面的

App.js

的修改版本，因为我已经阅读了各种帮助文档和代码。

您已经嵌入了一个webview。苹果想要的是让它清晰可见，它是一个外部URL

IOS上有所谓的SafariUI视图控制器，Android上有Chrome自定义选项卡

有几个插件，但我喜欢使用这个：

你已经嵌入了一个webview。苹果想要的是让它清晰可见，它是一个外部URL

IOS上有所谓的SafariUI视图控制器，Android上有Chrome自定义选项卡

有几个插件，但我喜欢使用这个：

Expo 你可以使用，因为苹果希望它是一个清晰可见的外部URL

装置

expo web browser

提供对系统web浏览器的访问，并支持处理重定向。在iOS上，它使用

SFSafariViewController

或

SFAuthenticationSession

，具体取决于您调用的方法；在Android上，它使用

ChromeCustomTabs

。从iOS 11开始，

SFSafariViewController

不再与Safari共享cookie，因此如果您使用

WebBrowser

进行身份验证，您将需要使用

WebBrowser.openAuthSessionAsync

，如果您只想打开网页（如您的应用程序隐私策略），则使用

WebBrowser.openBrowserAsync

用法

你可以查一下

世博会有点复杂，请查看相关信息

如果您想在ios中使用阅读模式，请参考此链接

世博会你可以使用，因为苹果希望它是一个清晰可见的外部URL

装置

expo web browser