딥링크와 앱링크

딥링크란

딥링크를 사용하면 유저가 앱과 앱을 오가는게 쉬워진다. 웹을 보다가, 특정 화면만 유저가 앱으로 봤으면 하는 경우 딥링크가 작동하는데, 이때 유저가 앱을 깔아두었으면 바로 해당화면으로 이동한다.

웹을 서핑하다가 앱으로 보내려고할 때 ...

1. 해당 서비스의 앱이 있다면 - 해당 앱으로 이동한다.
2. 해당 서버스의 앱이 없다면 - 해당하는 store로 이동한다.

이 기능을 가능하게 해주는데 딥 링크이다.

링크의 형태는 앱 스킴(URL 스킴) 혹은 일반적인 https:// 링크 두 가지 형태를 둘다 지원한다. 즉 https://www.example.com 혹은 app://open.my.app 두 형태를 모두 지원한다는 말이다. 또한, 아래 그림처럼 눌렀을 때 필요한 앱을 직접 선택할 수 있도록 한다는 특징이 있다.

예를 들어 우리가 모바일 게임을 사전 등록 했다가 출시 당일이 되면 링크가 날라온다. 해당 링크를 클릭하면 스토어로 이동하게 되는데 만약 앱이 설치한 후 다시 링크를 누르게 되면 바로 해당 게임이 열린다.

전체적인 개요를 보자

딥링크, deferred 딥링크

위에서 딥링크를 설명했다. 그런데 딥링크에는 크게 두가지 타입이 있다.

1. default deep link : 유저가 이미 앱을 깔았을 때만 원하는 화면으로 이동한다. 앱이 없는 경우 스토어로 연결한다. 즉, 미리 앱을 깐 유저들을 다시 데려오고 싶은 목적일 때만 유용하다.
2. defered deep link : 훨씬 복잡하다. 이 딥링크는 앱이 깔려있지 않은 유저를 App이나 Play Store로 데려간 다음, 설치된 뒤에는 원래 보고싶었던 페이지를 띄우게 한다. deferred deep link 는 Adjust (혹은 firebase) 같은 딥링킹 솔루션으로만 가능하다. 이 솔루션은 SDK 로 앱에 탑재하도록 제공하고 하고 있다. 그래서 만약 신발 광고를 클릭해서 앱을 다운로드하면, 유저는 스토어로 라우팅되었다가 - 앱이 설치되어 열리는 순간에 해당 신발의 페이지가 뜬다.

앱 스킴과 http 링크

앱 스킴 App Scheme (URL scheme)

앱으로 이동하는 url scheme은 이런 형식을 띈다.

naversearchapp://명령어?파라미터=옵션&버전

이름만 봐도 네이버 검색앱 (아마 네이버 모바일이겠지?)으로 가는 scheme 같다.

이 링크를 클릭하면, 모바일에서는 이렇게 인식한다.

• 위 scheme이 링크된 하이퍼 링크를 클릭한다. scheme이 시스템에 전달된다.
• 시스템에서 전달된 url scheme을 보고, '실행가능한 앱이 있나..? 🤔' 확인
• url scheme을 받을 수 있는 앱이 있다면 해당 앱을 실행시키며 url scheme을 전달
• 앱이 실행되면서 url을 참조해서 필요한 화면을 띄우거나 이동시킴

여기서

• if 앱이 있으면 앱이 실행된다. (iOS, Android 공통)
• else 앱이 없으면
  • intent scheme을 사용하면 자동으로 구글 플레이로 이동한다.
    • intent scheme에는 intent://<내용>;scheme=naversearchapp;action.. 등으로 intent로 구현되어있다. (intent는 안드로이드에서 페이지 간 이벤트를 전달하기 위해 사용하는 방식이다.)
    • intent가 없는 일반 scheme을 이용한 경우 (구글 플레이로 링크해서 앱설치 유도)

원래 앱과 웹을 연결할 때는 이렇게 URL 스킴만을 사용해서 진행하곤 했다. 실제로, 푸시메시지에는 이렇게 URL 스킴만 내려주어도, 해당 푸시를 누르면 해당 앱으로 이동한 뒤 스킴을 적용하기 때문에 원하는 페이지로 갈 수 있다.

http url

그러나 http url 형태를 사용하면 사용자의 OS 버전에 상관없이 원하는 앱 화면으로 이동시킬 수 있다. 즉 일관성있으며, http url은 유일하다는 장점이 있다. app scheme 은 사실 앱 들 간에 겹칠 수도 있는 정보이기 때문이다.

Android에서의 Deep Links와 App Links

IOS에서는 유니버셜 링크를 지원하지만 안드로이드에서는 DeepLink와 AppLink가 있다.

안드로이드에서의 Deep Links(딥링크)는 사용자가 안드로이드앱에서 특정 활동을 직접 지정할 수 있도록 하는Intent Filter 이다. 딥링크를 사용하면 사용자가 링크를 클릭했을 때 disambiguation dialog가 열리고, 사용자가 지정된 URL을 처리할 수 있는 여러 앱 중 하나를 선택할 수 있다.

예를 들어 아래의 그림1은 사용자가 지도 링크를 클릭한 후 지도앱 또는 크롬에서 링크를 열 것인지 묻는 disambiguation dialog를 보여준다.

그림1. The disambiguation dialog

App Links(앱링크)는 웹 사이트의 URL을 기반으로 하는 딥링크이다. 일반 딥 링크에서 한 단계 더 나아간 버전으로, 일반 딥링크는 위쪽의 그림에서 나와있듯이 연결할 앱과 링크가 1:1 관계임을 보장하지 못해서 유저가 직접 앱을 선택해야한다. 하지만 최신 Android 에서 App Link가 사용하는 웹사이트 URL은 인증된 것이기때문에 바로 연결되는 것 이다. 따라서 앱링크 방식으로 된 딥링크를 클릭하면 disambiguation dialog가 나타나는 것이 아니라 앱이 즉시 열린다. 만약 앱이 설치되어있지 않다면 해당 웹페이지로 이동한다.

아래의 표 에서 안드로이드에서의 딥링크와 앱링크 두 가지 방식의 차이점을 확인할 수 있다.

	Deep Links	App Links
Intent URL scheme	http, https, 커스텀 스키마	http와 https만 가능
Intent action	모두 가능	android.intent.action.VIEW만 가능
Intent category	모두 가능	android.intent.category.BROWSABLE과 android.intent.category.DEFAULT만 가능
Link verification	필요없음	Digital Asset Links 필요
User experience	사용자가 어떤 앱을 사용할 것인지 disambiguation dialog에서 선택할 수 있음	dialog없음. 해당 앱이 바로 열리거나 웹사이트로 이동함
Compatibility	모든 안드로이드 버전에서 가능	안드로이드 6.0 이상에서 가능

Dynamic Links(Firebase)

구글 파이어베이스에서도 다이나믹 링크(dynamic links)라는 서비스로 딥링크를 지원해준다.

안드로이드나 ios에서 직접 딥링크를 구현할때와 파이어베이스의 다이나믹 링크를 사용할 때 어떤 점이 다른지 비교해보았다.

deep links 직접 구현	Firebase dynamic links
안드로이드/ios 링크를 따로 만들어야함	안드로이드/ios를 하나의 링크로 사용 가능
사용자에게 보이는 링크가 2개	사용자에게 보이는 링크가 1개
앱 설치여부를 확인하는 기능을 개발자가 직접 구현해야함	파이어베이스에서 해줌
개발자만이 링크를 생성할 수 있음	마케터나 기획자가 원하는 방식으로 직접 할 수 있음

실제로 딥링크를 어떻게 구현해야할까 (javascript와 브라우저단에서)

위에서 살펴본, OS단에서 제공하는 딥링크는 버전 제한이 있다. 그러면 이전에 어떻게 scheme을 가지고 제공했을까?

예시를 들어보자. scheme 이 yourapp://path/first 라고 하자.

• 자바스크립트 solution
  • 앱이 설치되어있으면, 앱이 열린다.
  • 앱이 설치되어있지 않아서 yourapp://path/first 가 아무런 동작을 안하면, timeout 2초가 진행된다음 playstore로 동작한다.
  • 앱이 열리고나서도, 유저가 이 브라우저 화면 들어가면 계속해서 앱스토어로 리다이렉트 시킨다. 이 부분에 대한 조정이 필요함.
• intent Solution
  • 안드로이드 크롬 버전이 25+ 인 경우, 위 처럼 구현 할 필요없다. url intent 형태를 유저가 클릭하면
  • 앱이 설치되어있으면 크롬이 그 앱을 열어줌
  • 앱이 설치되어있지 않으면, 크롬이 playstore를 열어줌
  • 단 최신 버전에만 가능하고, 브라우저에 의존하는 것이기때문에 동작하지 않을 확률이 있음

intent://path/#Intent,;scheme=yourapp;package=com.yourapp.example

 

 

토스 앱링크

https://www.tosspayments.com/blog/articles/dev-4

 

콜백 메소드 설명

https://readystory.tistory.com/181

[Android] 웹뷰를 풍부하게 활용할 수 있도록 해주는 WebViewClient