[React Native] DeepLink.

안녕하세요, RyuWoong 입니다.

이번에는 App에서 마케팅과 큰 연관이 있는 DeepLink에 대해 이야기 해보고자 합니다.

이직 후 프로젝트에서 제가 실시한 큰 변경 사항이 RN버전과 딥링크 수정이였는데 이를 통한 경험을 적어보고자 합니다.

---

DeepLink?

우리가 인터넷을 사용할 때 주소라는 것이 있습니다.

naver.com , google.com 등 이 주소를 통해 원하는 사이트에 접속해서 정보를 검색 할 수 있죠.

 

이와 비슷하게 App은 DeepLink가 있습니다.

만약 단순히 앱만 실행해 준다면, 원하던 상품을 검색하거나 이벤트를 찾아야하는 번거로움 때문에 사용자는 앱을 바로 삭제하거나 사용하지 않겠죠? DeepLink를 클릭하면, 앱에서 보던 상품이나 이벤트 등을 이어서 볼 수 있게 해줄 수 있습니다.

 

DeepLink의 종류

DeepLink의 종류는 크게 2가지로 나뉘어집니다.

- URL Schema

- Universal Link(iOS), App Link(Android)

 

URL Schema

URL Schema는 가장 초기에 나왔던 DeepLink의 종류입니다.

앱에 Schema를 설정하고, 브라우저 주소창에 Schema를 입력하면, 내 핸드폰에 해당 Schema가 있는 앱을 찾아 실행해주는 방식입니다.

아래는 URL Schema의 예제입니다. 주로 아래와 같은 양식을 사용합니다.

path는 꼭 필요한 요소는 아니고, 개발자가 마음대로 사용할 수 있습니다.

{schema}://{path}?~~

널리 알려진 Schema는 sms, tel, market 등이 있습니다.

 

한계.

하지만 URL Schema의 단점이 있습니다.

1. 앱이 설치 되어 있어야만 동작합니다.

2. Schema는 Domain처럼 고유한 주인이 있는 것이 아니라 누구나 사용할 수 있습니다.

(예로, market schema를 사용하면 play store 외에 one store나 samsung store 중 무엇을 열겠냐고 물어보는 경우가 바로 중복된 Schema를 사용하고 있는 경우 나타나는 팝업입니다. 만약 iOS는 가장 최근에 설치한 App이 실행됩니다.)

이를 이용, 똑같은 Schema를 사용하여 앱이 실행되게 할 수 있습니다. 

 

극복을 위한 수단

URL Schema의 한계를 극복하기 위해 Universal Link(iOS), App Link(Android) 가 등장했습니다.

이 링크는 항상 웹사이트 주소 형태의 DeepLink로 만들어 집니다. 웹사이트 고유의 주소로 만들어 지기 때문에 고유하며, 따라서 도메인의 소유자여야만 제대로 동작합니다.

 

브라우저에서 이 링크를 입력 시, 앱이 설치되어 있다면 앱이 실행되고 아니라면 웹 URL로 인식되어 웹 링크로 실행합니다.

웹 링크로 실행 될 때 어떻게 처리하는냐에 따라 웹으로 컨텐츠를 제공해 줄 수 도 있고, App Store로 보내 앱 설치를 유도할 수도 있습니다.

 

한계.

하지만 이것도 완전한 해결법이 되지 못했습니다.

1. 플랫폼 브라우저 주소창이 아니라면 제대로 동작하지 않는 경우가 발생합니다. (크롬, 사파리가 아닌 곳에 주소를 입력했을 때, 즉 카카오톡이나 다른 앱을 통하여 주소를 열게 되면 제대로 동작하지 않을 수 있습니다.)

2. 링크를 선택 했을 때 앱이 설치되어 있지 않아 App Store로 보내 앱을 설치하고 실행하면 원하는 목적지로 가지 않고 이미 DeepLink는 유실되어 버려 앱 설치 후 다시 딥링크를 실행시켜야하는 불편함이 생깁니다.

 

Deffered DeepLink (지연된 딥링크)

해당 딥링크를 실행 했을때, 앱이 설치 되어 있는지 없는지에 따라 다르게 동작하게 됩니다.

 

앱이 설치된 경우.

앱을 실행시키고 원하는 동작 수행.

 

앱이 미설치된 경우.

Store로 연결 시켜 앱 설치를 유도한 후, 앱이 설치되고 실행되면 딥링크를 수행할 수 있게 함.

 

이는 앱들의 친구 초대와 같은 경우에서 많이 볼 수 있습니다.

직접 지연된 딥링크를 구연하기에는 꽤나 번거로운 작업임으로 이를 간편하게 만들어주는 업체들(Appsflyer, AirBridge, Firebase 등)이 있습니다.

 

원리

대부분 비슷한 구현 원리를 가지고 있는데,

1. 해당 업체를 통해 만든 링크를 실행.

2. 앱이 설치 되어 있는지 판별하여 설치 되어 있다면 바로 DeepLink 동작. 없다면 해당 사용자의 정보와 DeepLink를 업체 DB에 저장하고 앱 설치나 원하는 URL로 리다이렉트.

3. 앱이 뒤늦게 설치 되고 실행 시 업체 서버와 통신하여 해당 기기에서 저장된 DeepLink가 있는지 확인 후 DeepLink 실행. (업체마다 얼마나 오래 정보를 보관하고 있는지 다릅니다. 대략 1시간 정도 인거 같습니다.) 

사용자의 정보는 업체마다 다른 방식으로 사용자를 식별하기 때문에 확률적으로 나말고 다른 사용자가 매칭이 될 수도 있습니다.

 

주의할 점

제가 딥링크를 적용 하면서 애먹었던 부분이 Deffered DeepLink 동작이 제대로 되지 않는 점이였습니다. 알고보니 iOS에서 ATT 팝업을 띄우는 것과  개인정보보호 설정에서 추적을 아예 꺼놓은 점, 아무 생각 없이 켜져 있던 iCloud 비동기 릴레이가 Deffered DeepLink 동작을 방해하더라구요. 동작 원리를 보면 사용자 식별할 때 문제를 발생시킬수 있는 원인이였죠. 그래서 삽질을 했습니다. (여러분은 하지마세요 ㅠㅠ)

 

업체마다 다를수 있지만 이런 점들이 Deffered DeepLink의 동작을 방해 할 수 있으니 테스트 시 유의하시길 바랍니다!

 

오랜만에 일을 하니 정신이 없지만, 배운 점을 글로 남깁니다. 저처럼 제대로 Deffered  DeepLink가 동작하지 않아서 해매시는 분들이 계실지도 모르니 도움이 되셨으면 합니다.