Skip to content

DeepLink

Jump to bottom
Seungjae Yoon edited this page Aug 13, 2024 · 2 revisions

딥링크 (Deeplink) - URI스킴, 유니버설 링크, 앱링크 구분과 이해

딥링크 방식 구분

딥링크는 3가지 방식으로 구분됩니다:

  1. URI 스킴 방식: 앱에 URI 스킴(scheme) 값을 등록하여 딥링크를 사용합니다.
  2. 앱링크 (App Link): Android에서 제공 - 도메인 주소를 이용한 딥링크를 사용합니다.
  3. 유니버설 링크 (Universal Link): iOS에서 제공 - 도메인 주소를 이용한 딥링크를 사용합니다.

URL 스킴

유니크한 도메인이 없이 앱이 설치되어 있다는 전제하에 간단하게 연결 설정이 가능합니다.

동작 확인

1. AOS (Android)

디바이스에서 메모장이나 인터넷 검색창에 다음 URL을 입력합니다:
https://blueberrytemplate-2024-summer.web.app/mbti

  • 여기서 도메인은 blueberrytemplate-2024-summer.web.app이며, /mbti 자리는 고라우터(GoRouter)에 명명된 path를 사용합니다.

결과:

  • 앱 설치 시: mbti 페이지로 이동합니다.
  • 앱 미설치 시: 웹으로 이동합니다.

현재로서는 웹 페이지 라우팅이 설정되지 않았기 때문에 404 not found 오류가 발생할 수 있습니다. 추후 앱이 설치되지 않은 경우, 사용자를 바로 스토어로 보낼지, 웹 페이지로 이동 후 스토어로 연결 가능한 버튼을 제공할지 결정해야 합니다.

2. iOS

iOS에서도 1번과 동일하게 동작합니다. 그러나 현재 teamID 설정을 스킵한 상태이므로 동작 확인이 불가능한 상태입니다.

3. WEB

앱이 설치되지 않은 경우, 자동으로 웹으로 이동합니다. 프로젝트 내에서 firebase.json의 rewrites를 통해 원하는 페이지로 연결할 수 있습니다.

요구사항 및 해결책

우리 서비스에 필요한 기능은 다음과 같습니다:

  1. 폰에서 링크 클릭:

    • 앱이 설치되어 있지 않으면 웹페이지로 연결.
    • 앱이 설치되어 있으면 앱으로 연결.
    • 앱이 설치되어 있지 않으면 스토어로 (지연된 딥링크 방식).
    • 설치되지 않은 경우 웹으로 가고, 거기서 스토어로 연결 가능한 버튼 처리.

  2. 웹상에서 링크 클릭:

    • 웹페이지로 연결.

서비스 의도대로 하기 위해서는 앱이 설치되어 있지 않은 상태도 고려해야 하므로 URL 스킴 방식은 불가능하며 도메인이 필요합니다.

해결책: Firebase Hosting 이용!

1. 앱링크 (for Android)

참고자료:

설정 방법

  1. 따로 웹서버를 두지 않았다면, 플러터 프로젝트의 public/.well-known/ 폴더를 만들고 assetlinks.json 파일을 생성합니다.

    [
  {
    "relation": ["delegate_permission/common.handle_all_urls"],
    "target": {
      "namespace": "android_app",
      "package_name": "<app_package_name>",
      "sha256_cert_fingerprints": ["<sha256_fingerprint>"]
    }
  }
]

    <app_package_name>과 <sha256_fingerprint> 부분을 프로젝트에 맞게 변경합니다. SHA 부분은 프로젝트/android/ 폴더에서 다음 명령어를 실행하여 얻을 수 있습니다.

    ./gradlew signingReport

  2. Firebase Hosting 설정:

    $ firebase init hosting
$ firebase deploy

  3. AndroidManifest.xml에서 activity 태그 안에 다음을 추가합니다:

    <!-- App Links -->
<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" />

  <!-- Accepts URIs that begin with https://YOUR_HOST -->
  <data android:scheme="https" android:host="[YOUR_HOST]" android:pathPrefix="/[NAME][/NAME...]" />
</intent-filter>

    여기서 [YOUR_HOST]는 호스팅한 도메인 주소이며, android:pathPrefix="/[NAME][/NAME...]" 부분은 생략할 수 있습니다.

2. 유니버설 링크 (for iOS)

참고자료:

설정 방법

  1. Xcode에서 설정:

    • info에서 ctrl+왼쪽마우스 클릭 후, Raw Keys and Values 선택.
    • ctrl+왼쪽마우스 클릭 후, Add Row 선택.

    Key: FlutterDeepLinkingEnabled
    Type: Boolean
    Value: YES

  2. ios/Runner/Runner.entitlements 파일을 열고, 다음을 추가합니다:

    <dict>
  <key>com.apple.developer.associated-domains</key>
  <array>
    <string>applinks:example.com</string>
  </array>
</dict>

    여기서 example.com은 패키지명으로 변경합니다.

  3. 프로젝트의 public/.well-known/ 안에 apple-app-site-association 파일을 생성하고, 다음 내용을 입력합니다:

    {
  "applinks": {
    "apps": [],
    "details": [
      {
        "appIDs": ["<teamId>.<bundleId>"],
        "paths": ["*"],
        "components": [{ "/": "/*" }]
      }
    ]
  },
  "webcredentials": {
    "apps": ["<teamId>.<bundleId>"]
  }
}

    <teamId>와 <bundleId>는 프로젝트에 맞게 변경합니다. 그 후 firebase deploy 명령어를 실행합니다.

3. 웹 접근

프로젝트의 firebase.json에서 hosting 안쪽에 다음을 추가하여 원하는 페이지로 리디렉션이 가능하도록 설정합니다:

"rewrites": [
  {
    "source": "/mbti",
    "destination": "/mbti/index.html"
  },
  {
    "source": "**",
    "destination": "/index.html"
  }
]
Clone this wiki locally