React Native WebView에서 브라우저를 Chrome으로 변경하려면 일반적으로 WebView 컴포넌트 자체를 직접 변경하는 것이 아니라 Android에서는 Chrome Custom Tabs를 사용합니다. Chrome Custom Tabs는 Chrome과 통합된 웹 탐색 경험을 제공하므로 훨씬 원활한 사용자 경험을 제공합니다. 이를 어떻게 할 수 있는지 살펴보겠습니다.

1. 의존성 설치: 먼저 프로젝트에 필요한 종속성을 설치해야 합니다. Android에서는 **react-native-custom-tabs**를 추가해야 합니다.

npm install react-native-custom-tabs

1. 라이브러리 링크 (React Native 버전이 0.60 미만인 경우): React Native 버전이 0.60 미만인 경우 **react-native link**를 사용하여 라이브러리를 링크해야 합니다.

react-native link react-native-custom-tabs

1. React Native 코드에서 사용: 이제 WebView이 있는 React Native 코드에서 WebView을 버튼으로 대체하고, 해당 버튼을 클릭하면 URL이 Chrome Custom Tabs에서 열리도록합니다.

import React from 'react';
import { View, Button } from 'react-native';
import { CustomTabs } from 'react-native-custom-tabs';

const MyWebViewComponent = () => {
  const openURLInChrome = async () => {
    const url = '<https://www.example.com>'; // 여기에 원하는 URL을 입력하세요
    try {
      await CustomTabs.openURL(url, {
        toolbarColor: '#6200EE', // 필요에 따라 툴바 색상을 사용자 정의합니다
        enableUrlBarHiding: true,
        showPageTitle: true,
        enableDefaultShare: true,
        forceCloseOnRedirection: true,
      });
    } catch (error) {
      console.error('Chrome Custom Tabs에서 URL 열기에 실패했습니다: ', error);
    }
  };

  return (
    <View>
      <Button title="Chrome에서 열기" onPress={openURLInChrome} />
    </View>
  );
};

export default MyWebViewComponent;

이 설정을 사용하면 사용자가 버튼을 클릭할 때, Chrome이 디바이스에 설치되어 있다면 지정된 URL이 Chrome Custom Tabs에서 열립니다.

iOS의 경우 직접적으로 Chrome Custom Tabs에 해당하는 기능은 없습니다. 대신 **SafariServices**를 사용하여 **SFSafariViewController**를 통해 Safari에서 링크를 열 수 있습니다. 이는 네이티브 코드 통합이 필요하며, Android의 Chrome Custom Tabs와 같은 수준의 사용자 정의를 제공하지 않을 수 있습니다.