플러터에서 URL 탐색: url_launcher 패키지 사용 가이드

Flutter 앱에서 웹 페이지를 열거나 다른 앱으로 데이터를 전달하는 기능은 필수적입니다. url_launcher 패키지는 이러한 작업을 간편하게 수행할 수 있도록 지원하며, 다양한 옵션을 통해 개발자가 원하는 대로 URL을 탐색할 수 있도록 합니다.

1. 설치

프로젝트에 url_launcher 패키지를 설치하려면 다음 명령어를 실행합니다.

 

pub add url_launcher

 

2. 기본 사용

2.1 브라우저로 URL 열기

launchUrl() 함수를 사용하여 브라우저에서 URL을 엽니다.

import 'package:url_launcher/url_launcher.dart';

Future<void> _launchURL() async {
  final String url = 'https://www.google.com';
  if (await canLaunchUrl(url)) {
    await launchUrl(Uri.parse(url));
  } else {
    throw 'Could not launch URL';
  }
}

 

2.2 앱 스키마 사용하여 데이터 전달

launchUrl() 함수를 사용하여 다른 앱으로 스키마를 사용하여 데이터를 전달합니다.

Future<void> _launchApp() async {
  final String appScheme = 'myapp://';
  final String data = 'This is my data';
  final String url = '$appScheme$data';
  if (await canLaunchUrl(url)) {
    await launchUrl(Uri.parse(url));
  } else {
    throw 'Could not launch URL';
  }
}

**

URL 스키마의 구조 참고

URL 스키마는 다음과 같은 기본 구조를 가집니다:

ruby

코드 복사

<scheme>://<authority>/<path>?<query>

• scheme (스키마): 리소스에 접근하는 프로토콜 또는 방식 (예: http, https, mailto, tel, customschema)
• authority: 도메인 이름 또는 IP 주소 (옵션)
• path: 리소스 경로
• query: 추가적인 파라미터 (옵션)

3. 옵션

3.1 강제 웹 브라우저 사용

forceWebView 매개 변수를 true로 설정하면 기기의 기본 브라우저 대신 항상 웹 브라우저를 사용하여 URL을 엽니다.

await launchUrl(Uri.parse(url), forceWebView: true);

 

3.2 웹 브라우저 사용 여부 확인

canLaunchUrl() 함수를 사용하여 특정 URL을 기기의 기본 브라우저에서 열 수 있는지 확인합니다.

 

if (await canLaunchUrl(url)) {
  // URL을 열 수 있습니다.
} else {
  // URL을 열 수 없습니다.
}

 

3.3 맞춤 브라우저 탭 설정

customTabsConfiguration 매개 변수를 사용하여 Chrome 커스텀 탭의 모양과 동작을 설정할 수 있습니다.

 

final CustomTabsConfiguration customTabsConfiguration = CustomTabsConfiguration(
  toolbarColor: Colors.blue,
  enableUrlBarHiding: true,
  showTitle: true,
  actionButtons: [
    CustomTabsActionButton(
      icon: Icon(Icons.share),
      label: 'Share',
    ),
  ],
);

await launchUrl(Uri.parse(url), customTabsConfiguration: customTabsConfiguration);

 

3.4 Chrome Custom Tabs 지원 여부 확인

isChromeCustomTabsSupported() 함수를 사용하여 기기에서 Chrome Custom Tabs를 지원하는지 확인합니다.

 

if (await isChromeCustomTabsSupported()) {
  // Chrome Custom Tabs를 사용할 수 있습니다.
} else {
  // Chrome Custom Tabs를 사용할 수 없습니다.
}

 

3.5 Chrome Custom Tabs 색상 테마 설정

androidManifest 파일을 사용하여 Chrome Custom Tabs의 색상 테마를 설정합니다.

 

<activity
    android:name=".MainActivity"
    android:exported="true">
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data android:scheme="https" />
    </intent-filter>

    <meta-data
        android:name="android.support.customtabs.customTabsColor"
        android:resource="@color/custom_tab_color" />
</activity>

 

3.6 iOS Universal Links 설정

Info.plist 파일을 사용하여 iOS Universal Links를 설정합니다.

 

<key>NSAppTransport

 

 3.7 플랫폼 별 설정

launchUrl() 함수의 headers 매개 변수를 사용하여 플랫폼별 추가 헤더를 설정할 수 있습니다.

final Map<String, String> headers = {'platform': 'flutter'};
await launchUrl(Uri.parse(url), headers: headers);

 

3.8 URL 쿼리 매개 변수 설정

launchUrl() 함수의 queryParameters 매개 변수를 사용하여 URL 쿼리 매개 변수를 설정할 수 있습니다.

final Map<String, String> queryParameters = {'q': 'search term'};
await launchUrl(Uri.parse(url), queryParameters: queryParameters);

 

3.9 URL 정규 표현식 검사

isLink() 함수를 사용하여 특정 문자열이 유효한 URL인지 확인합니다.

final String text = 'https://www.example.com';
if (await isLink(text)) {
  // 유효한 URL입니다.
} else {
  // 유효한 URL이 아닙니다.
}

 

3.10 URL 인코딩 및 디코딩

Uri.encodeQueryComponent() 및 Uri.decodeQueryComponent() 함수를 사용하여 URL 문자열을 인코딩 및 디코딩합니다.

final String encodedUrl = Uri.encodeQueryComponent('This is my data with spaces');
final String decodedUrl = Uri.decodeQueryComponent(encodedUrl);

 

4. 주의 사항

• url_launcher 패키지는 Flutter 2.0 이상에서만 사용할 수 있습니다.
• URL을 열기 전에 canLaunchUrl() 함수를 사용하여 해당 URL을 기기에서 처리할 수 있는지 확인해야 합니다.
• 사용자가 앱 설치를 거부하거나 해당 앱이 설치되지 않은 경우 URL을 열 수 없습니다.
• 일부 URL은 기기에서 처리할 수 없을 수 있습니다.
• Android 9(Pie) 이하 버전에서는 Chrome Custom Tabs가 기본적으로 지원되지 않으며, 별도의 설정이 필요할 수 있습니다.

5. 참고자료

• url_launcher 공식 문서

6. 마무리

url_launcher 패키지는 Flutter 앱에서 간편하게 URL을 탐색하고 다른 앱과 데이터를 공유하는 데 매우 유용한 도구입니다. 다양한 옵션을 통해 개발자가 원하는 대로 URL을 처리할 수 있도록 지원하며, 앱 기능을 확장하고 사용자 경험을 향상시키는 데 도움이 됩니다.

본 블로그 게시글에서 다룬 내용을 참고하여 Flutter 앱에서 URL 탐색 기능을 효과적으로 활용하시기 바랍니다. 궁금한 점이나 도움이 필요한 부분이 있으면 언제든지 질문해주세요.

 

참고: 이 블로그 게시글은 2024년 6월 3일에 작성되었습니다. 정보가 최신인지 확인하기 위해서는 관련 문서 및 공식 자료를 참고하시기 바랍니다.

 

수발가족을 위한 일기장 “나비일기장”

 

https://play.google.com/store/apps/details?id=com.maccrey.navi_diary_release

 

비공개테스트를 위한 20명의 테스터모집 앱 "테스터 쉐어"

 

https://play.google.com/store/apps/details?id=com.maccrey.tester_share_release