Как сделать загрузку сайта не через браузер в React Native?

В React Native нет встроенного способа для непосредственной загрузки сайта без использования встроенного браузера, так как React Native предназначен для создания мобильных приложений, а не браузеров. Однако, есть несколько подходов, которые можно использовать, чтобы достичь желаемого результата.

1. Использование WebView: React Native предоставляет WebView компонент, который позволяет отображать HTML-контент и загружать сайты. Вы можете использовать WebView для загрузки сайта, скрывая адресную строку и другие элементы интерфейса браузера при помощи CSS или JavaScript. Вот простой пример кода:

import React from 'react';
import { WebView } from 'react-native';

const WebsiteScreen = () => {
  return (
    <WebView source={{ uri: 'https://www.example.com' }} />
  );
};

export default WebsiteScreen;

2. Использование HTTP-запросов: Вы можете использовать библиотеки для выполнения HTTP-запросов, такие как Axios или Fetch, чтобы получить содержимое сайта и отобразить его в пользовательском интерфейсе вашего приложения. Например, можно отправить GET-запрос на сервер и получить HTML-контент сайта, а затем отобразить его в React Native компоненте. Вот пример с использованием Axios:

import React, { useEffect, useState } from 'react';
import axios from 'axios';
import { Text } from 'react-native';

const WebsiteScreen = () => {
  const [websiteContent, setWebsiteContent] = useState('');

  useEffect(() => {
    axios.get('https://www.example.com')
      .then(response => {
        setWebsiteContent(response.data);
      })
      .catch(error => {
        console.error(error);
      });
  }, []);

  return (
    <Text>{websiteContent}</Text>
  );
};

export default WebsiteScreen;

3. Управление WebView с помощью JavaScript: Если вам нужно более гибкое управление, вы можете использовать WebView вместе с JavaScript для загрузки и отображения сайта. Вы можете использовать методы WebView, такие как injectJavaScript и evaluateJavaScript, чтобы выполнить определенный JavaScript-код на загруженной странице и манипулировать ее содержимым. Вот пример:

import React, { useRef } from 'react';
import { WebView } from 'react-native';

const WebsiteScreen = () => {
  const webViewRef = useRef(null);

  const handleWebViewLoad = () => {
    const script = `
      // Execute JavaScript code on the loaded website
      alert('Hello, world!');
    `;
    webViewRef.current.injectJavaScript(script);
  };

  return (
    <WebView
      ref={webViewRef}
      source={{ uri: 'https://www.example.com' }}
      onLoad={handleWebViewLoad}
    />
  );
};

export default WebsiteScreen;

В каждом из этих способов есть свои особенности и ограничения, поэтому выбор подхода зависит от ваших конкретных потребностей и требований проекта. Учитывайте, что использование внутреннего браузера WebView может иметь некоторые ограничения по функциональности или приватности в сравнении с полноценным браузером.