본문 바로가기
Flutter/Package

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

by Maccrey Coding 2024. 7. 18.
728x90
반응형

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. 참고자료

6. 마무리

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

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

 

728x90
반응형