본문 바로가기
프로그래밍/Flutter <Dart>

[Flutter/android] 플러터에 안드로이드 앱 링크 적용하기 with Go Router

by TaeGyeong Lee 2024. 12. 7.

개요 

플러터 프로젝트에 안드로이드에서 제공하는 app link 기능을 적용해 보겠습니다. android app link는 링크 형태를 통해 안드로이드 앱 내부로 접근 가능하도록 돕는 여러 링크 유형 중 하나입니다.  android app link에 대해선 공식 문서를 참고하세요.

 

전제 

앱 링크를 구현하는 방법은 여러 가지 입니다. 앱 링크를 적용할 플러터 프로젝트는 아래 flutter 플러그인을 사용해야 합니다. 

아래 플러그인은 사용하지 않습니다. (사용하지 말아야 합니다) 

 

AndroidManifest.xml 수정  

android > app > src > main > AndroidManifest.xml 파일에 

flutter_deeplinking_enabled 기능을 사용할 것임을 추가하세요. 

<meta-data android:name="flutter_deeplinking_enabled" android:value="true" />

 

또한 아래와 같이 android:autoVerify 값이 true 인 인텐트 필터를 추가하세요. YOURHOST 를 본인이 사용할 호스트로 수정하세요. 예) abcdef.github.io 

            <intent-filter android:autoVerify="true">
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                <data android:scheme="http" android:host="YOURHOST.com"/>
                <data android:scheme="https" />
            </intent-filter>

 

위 내용을 추가한 결과는 다음과 같습니다. 

경고  
MAIN/LAUNCHER 인텐트 필터와 VIEW 인텐트 필터를 반드시 분리하세요 ! 
서로 다른 인텐트 필터 안에 선언해야 합니다. 
<intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
            <meta-data android:name="flutter_deeplinking_enabled" android:value="true" />
            <intent-filter android:autoVerify="true">
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                <data android:scheme="http" android:host="YOURHOST"/>
                <data android:scheme="https" />
            </intent-filter>

 

잘 감이 오지 않는다면, 플러터 공식 예제 AndroidManifest.xml 내용을 참고하세요.

 

codelabs/deeplink_cookbook/android/app/src/main/AndroidManifest.xml at main · flutter/codelabs

Flutter codelab examples. Contribute to flutter/codelabs development by creating an account on GitHub.

github.com

 

package_name 확인 

android > app > src > build.gradle 에서 namespace 값이 package_name 입니다. 이를 확인해 주세요 .

...
android {
    namespace "여기"
    compileSdkVersion 34 // original : flutter.compileSdkVersion
    ndkVersion flutter.ndkVersion
    
    ...

 

SHA265 키 확인 

두 가지 방법을 통해 SHA256 키를 복사할 수 있는데, google play 앱 서명키를 사용할 경우로컬에서 keystore 를 관리하는 경우에 따라 나뉩니다. 경우에 맞는 방법을 통해 SHA256 키를 찾아주세요. 

 

assetlinks.json 작성 

assetlinks.json 파일을 아래와 같이 생성해 주세요.

  • package_name : 위에서 확인한 package_name으로 변경 
  • sha256_cert_fingerprints : 위에서 확인한 SHA256 키로 변경해 주세요. 
[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
    "namespace": "android_app",
    "package_name": "com.example.deeplink_cookbook",
    "sha256_cert_fingerprints":
    ["FF:2A:CF:7B:DD:CC:F1:03:3E:E8:B2:27:7C:A2:E3:3C:DE:13:DB:AC:8E:EB:3A:B9:72:A1:0E:26:8A:F5:EC:AF"]
  }
}]

 

호스트에 assetlinks.json 추가 

링크의 호스트 /.well-kown 위치에 작성한 assetlinks.json 파일을 추가합니다. 실제로 접근 가능한 지 확인해 보세요. 실제로 접근 가능해야 합니다. 현재 운영중인 웹사이트가 없는 경우 github pages 호스팅을 이용해 보세요. 

 

적용 확인 

위 과정을 모두 완료하였다면, 에뮬레이터/실 기기에 앱을 빌드한 상태에서 터미널을 열어 아래 명령을 통해 자동으로 앱으로 이동하는 지 확인해 보세요. 

주의
아래 명령어는 AndroidMenifest.xml와 플러터 프로젝트 go_router가 정상적으로 설정되어 있는 지 확인하는 것에 가깝지, assetlinks.json 등 기타 설정이 정상적으로 설정되어 있음을 보장하지 않습니다.
adb shell am start -a android.intent.action.VIEW \
    -c android.intent.category.BROWSABLE \
    -d "http://YOUR_HOST"

 

만약 문제가 있다면 아래 명령을 통해 확인하세요. 

adb shell pm get-app-links PACKAGE_NAME

 

Q&A

❓ 로컬에서 keystore 를 생성 후 SHA256 값을 assetlinks.json 에 사용했습니다. 그리고 평상 시 사용하는 debug 모드로 앱을 설치하였습니다. 위 adb 명령어를 통해 앱이 자동 실행되는 것은 확인했으나 링크 클릭 시 자동으로 앱으로 이동하지 않았습니다. 왜 링크 클릭 시 앱으로 자동 이동하지 않나요?

🅰️ 로컬 keystore 를 생성한 후 이를 빌드에 사용하지 않을 경우 당연히 동작 안합니다. 플러터 앱 서명하는 방법에 대해 확인해 보세요. 

 

참고 자료 

 

Android 앱 링크 인증하기  |  Android Developers

이 페이지는 Cloud Translation API를 통해 번역되었습니다. Android 앱 링크 인증하기 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. Android 앱 링크는 사용자가 앱

developer.android.com

 

Set up app links for Android

Learn how to set up app links for an Android application built with Flutter.

docs.flutter.dev

 

플러터 Navigator, go_router, deep-linking

https://docs.flutter.dev/ui/navigation 개요 Router, Navigator 둘 다 페이지 이동할 때 사용할 수 있다. 복잡한 요구사항이 들어가면 Router를 써야 된다. 네비게이터 쓰는 법 그냥 위젯 인스턴스를 통째로 넘겨

velog.io

 

codelabs/deeplink_cookbook/android/app/src/main/AndroidManifest.xml at main · flutter/codelabs

Flutter codelab examples. Contribute to flutter/codelabs development by creating an account on GitHub.

github.com

 

앱 콘텐츠 딥 링크 만들기  |  Android Developers

사용자가 링크를 통해 앱으로 이동할 수 있게 하려면 앱 매니페스트에서 관련 활동에 인텐트 필터를 추가해야 합니다. 이러한 인텐트 필터를 사용하면 모든 활동의 콘텐츠로 연결되는 딥 링크

developer.android.com