使用网页初始化react-native ios应用程序时崩溃

Question

我的应用程序只加载一个网页，但安装后第一次加载大约需要10到15秒，这导致Apple拒绝我的提交。我的应用程序是用react-native制作的。

我在编译中得到回报：

警告：-[BETextInput attributeMarkedText] 未实现

WebContent 进程 (0x11b01c680) 启动需要 1.044328 秒

无法从 WebPrivacy 请求允许的查询参数。

我的代码：

import React, {useEffect, useState} from 'react';
import {View, Text, StyleSheet, SafeAreaView, BackHandler} from 'react-native';
import {WebView} from 'react-native-webview';

export default function App() {
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
    BackHandler.addEventListener('backPress', () => true);
    return () => BackHandler.removeEventListener('backPress', () => true);
  }, []);

  const handleLoad = () => {
    setIsLoading(false);
  };

  return (
    <SafeAreaView style={styles.container}>
      <WebView
        source={{uri: 'https://www.google.com'}}
        style={styles.webView}
        onLoad={handleLoad}
      />
      {isLoading && (
        <View style={styles.loadingContainer}>
          <Text style={styles.loadingText}>Carregando...</Text>
        </View>
      )}
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  webView: {
    flex: 1,
  },
  loadingContainer: {
    ...StyleSheet.absoluteFillObject,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'rgba(0, 0, 0, 0.5)',
  },
  loadingText: {
    fontSize: 20,
    color: 'white',
  },
});

我尝试更改我的网址，但不起作用。 我删除了加载网页的功能和错误，它正在工作，但我需要使用这些功能。

Answer 1

我确认我的第一个加载页面正在崩溃。

我的旧代码：

import { AppRegistry, Platform } from 'react-native';
import { request, PERMISSIONS } from 'react-native-permissions';
import App from './app';
import {name as appName} from './app.json';

const requestCameraPermission = async () => {
 AppRegistry.registerComponent(appName, () => App);

 if (Platform.OS === 'ios') {
     await request(PERMISSIONS.IOS.CAMERA);
 }

}

我的应用程序在加载内容之前一直等待权限请求，这导致它崩溃。

我将代码更改为：

import {AppRegistry} from 'react-native';
import App from './app';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

还有我的app.js

import React, {useEffect, useState} from 'react';
import {View, Text, StyleSheet, SafeAreaView, BackHandler} from 'react- 
native';
import {request, PERMISSIONS} from 'react-native-permissions';
import {WebView} from 'react-native-webview';

export default function App() {
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
   BackHandler.addEventListener('backPress', () => true);
   return () => BackHandler.removeEventListener('backPress', () => true);
  }, []);

  const handleLoad = () => {
    setIsLoading(false);

    if (Platform.OS === 'ios') {
      request(PERMISSIONS.IOS.CAMERA);
    }
  };

  return (
  <SafeAreaView style={styles.container}>
  <WebView
    source={{uri: 'https://www.google.com.'}}
    style={styles.webView}
    onLoad={handleLoad}
  />
  {isLoading && (
    <View style={styles.loadingContainer}>
      <Text style={styles.loadingText}>Carregando...</Text>
    </View>
  )}
  </SafeAreaView>
  );
  }

这解决了我的问题。