DeepLink(작성중)

DeepLink(작성중)

작성중

link.berriz.in

딥링크는 앱 내의 특정 페이지로 바로 연결해주는 링크입니다. 웹 링크가 특정 웹페이지로 바로 이동시켜주듯이, 딥링크는 앱 사용자에게 앱 화면까지 직접 이동할 수 있는 경로를 제공합니다.

예를 들어, 친구에게 베리즈 앱의 특정 상품 페이지를 공유할 때 딥링크를 사용하면, 받는 사람이 해당 링크를 누를 경우 앱이 열리면서 바로 그 상품 상세 화면이 표시됩니다.(사용자가 바로 가치있는 액션을 할 수 있도록 유도)

사용자마다 앱이 설치되어 있는지 여부를 사전에 알 수 없기 때문에, 딥링크는 앱이 설치된 경우와 설치되지 않은 경우 모두 적절히 대응할 수 있어야합니다. 설치되어 있다면 앱을 실행시켜 원하는 화면으로 랜딩시키고 설치되어있지 않다면 앱스토어나 게이트 페이지를 노출하여 자연스럽게 유저가 다음 동작을 할 수 있도록 유도해야합니다.

딥링크에는 몇가지 유형이 존재합니다. 딥링크의 적절한 조합으로 위 동작을 구현할 수 있습니다.

딥링크의 유형

커스텀 스킴 (Custom Scheme, URI Scheme)

berriz://signup

Scheme = 앱을 식별(베리즈)

Path = 앱 내 페이지를 특정함 (베리즈 내 회원가입 페이지)

커스텀 스킴은 오랫동안 사용되어 온 방식으로 가장 일반적으로 사용되는 딥링크입니다. 스킴은 URL에서 프로토콜을 나타내는 부분입니다.

브라우저에 커스텀 스킴 주소를 입력했을 때 앱이 설치되어있다면 앱의 특정 페이지로 이동하지만 앱이 설치되어 있지 않다면 아무일도 일어나지 않습니다. 앱이 설치되어 있지 않은 사용자에 대해서 fallback 처리를 할 수 없는 것은 커스텀 스킴의 단점입니다. 하지만 커스텀 스킴을 브라우저에 입력하는게 아닌 애플리케이션 내부에서 버튼과 같이 유저가 트리거할 수 있는 곳에 심어놓고 특정 버튼을 누를 때 앱이 설치되어있다면 앱으로 이동시키고 앱이 설치되어 있지 않다면 일정시간 내에 앱이 열리지 않았다는 것을 이용하여 앱스토어로 이동시킬 수 있어서 유저의 액션에는 커스텀 스킴을 사용하여 처리했습니다.

커스텀 스킴은 전 세계 개발자가 자유롭게 정할 수 있다보니 동일한 스킴이 겹치는 상황이 있을 수 있습니다. 스킴이 겹치는 경우 안드로이드와 iOS 동작 방식이 다르고 각 앱의 스킴은 외부로 드러나지 않아서 다른 앱에서 이미 사용하고 있는 스킴인지 알 수 없습니다.

커스텀 스킴은 브라우저에서 입력했을 때 fallback 동작을 정의할 수 없는 문제, 다른 애플리케이션과 겹칠 수 있는 문제가 있기 때문에 애플과 구글이 각각 새로운 딥링크 표준을 만들었습니다.

유니버셜 링크(iOS) 앱링크(Android)

유니버설 링크는 iOS 9부터 도입된 딥링크 방식으로, 애플이 커스텀 스킴의 한계를 보완하기 위해 제시한 방법입니다.

유니버셜 링크는 커스텀 스킴과는 다르게 소유권을 증명할 수 있습니다. 유니버셜 링크를 사용하려면 앱 개발자가 소유한 도메인과 앱을 1:1로 연결해야합니다. 애플의 연관 도메인(Associated Domains) 설정을 통해 앱에 허용할 도메인을 명시하고 해당 도메인의 서버에서는 apple-app-site-association이라는 파일을 호스팅해야합니다. 이 파일에는 어떤 앱이 어떤 경로 패턴의 URL을 처리할 수 있는지가 기술되어 있습니다.

유니버셜 링크는 일반적인 웹 링크처럼 보이지만, 도메인과 앱 간의 연관 관계를 설정해놓아서 해당 URL을 탭했을 때 웹 페이지를 열지 않고 앱을 바로 실행시킬 수 있습니다. 예를 들어서 berriz.in 도메인이 유니버셜 링크를 지원하도록 설정되어있다면 iOS에서 URL을 탭했을 때 디바이스는 해당 도메인에 등록된 앱이 설치되어있는지를 확인합니다. 등록된 앱이 있다면 사파리 브라우저가 열리는 대신에 berriz 앱이 실행되어 앱 내부의 특정 페이지로 이동시킬 수 있습니다. 앱이 설치되어있지 않은 경우에는 해당 페이지를 웹 브라우저에서 로드하므로 사용자는 같은 링크로 앱이 있으면 앱에서, 없으면 웹에서 컨텐츠를 보는 자연스러운 경로가 만들어집니다. 웹으로 진입한 경우는 앱이 설치되어있지 않거나 카카오톡의 인앱 브라우저와 같이 유니버셜 링크를 지원하지 않는 케이스에 해당되기 때문에 해당 페이지에서 커스텀 스킴을 추가로 호출하는 방식으로 딥링킹을 할 수 있습니다. 커스텀 스킴까지 호출했는데 앱으로 이동하지 못한 유저는 애플리케이션이 설치되지 않은 유저라고 판단하여 웹에서 앱 설치와 같은 추가 동작을 유도할 수 있습니다.

안드로이드 앱 링크(App Links)는 Android 6.0 (Marshmallow)부터 도입된 기능으로, 안드로이드에서 커스텀 스킴 문제를 해결하기 위해 내놓은 공식 딥링크 표준입니다. iOS의 유니버설 링크와 개념적으로 유사하게, 도메인 소유권을 검증하여 웹 URL과 앱 화면을 연결하는 방식입니다. 앱이 없는 경우에 유니버셜 링크와 마찬가지로 브라우저가 그 URL의 웹페이지를 열게 되므로 iOS와 마찬가지로 자연스럽게 사용자의 다음 액션을 유도할 수 있습니다.

link.berriz.in 서브 도메인이 필요한 이유

berriz.in을 유니버셜/앱링크로 사용하게 되는 경우 모바일 웹 berriz 내부에서 네비게이션할 때 의도치 않게 앱이 켜지는 상황이 발생할 수 있습니다. iOS의 경우 해당 상황에서 사용자의 브라우저 네비게이션 행위를 중심적으로 여기기 때문에 브라우저 네비게이션이 일어나지만 안드로이드의 경우 앱이 열립니다. 이런 상황은 베리즈를 웹에서 이용하는 중이기 때문에 갑자기 앱이 열리는 것은 오히려 UX를 해칠 수 있습니다.

서브 도메인 link.berriz.in을 활용한다면 berriz.in 웹 내부에서의 내비게이션 동작은 그대로 유지할 수 있습니다. 베리즈의 특정 페이지를 공유하려고 한다면 link.berriz.in을 공유하면 딥링크를 통해 앱이 설치되어있는 유저는 베리즈 앱에서, 앱이 설치되어있지 않은 유저는 베리즈 웹으로 이동시킬 수 있습니다.

위 동작을 구현하기 위해서 link.berriz.in/example/path 로 유저가 진입했을 때 link.berriz.in에서 유저는 사실 berriz.in/example/path 로 가고 싶다는 것을 알고 있으면 됩니다. 하지만 중계해줘야할 도메인이 berriz.in과 shop.berriz.in이 있고 경로도 오픈하고자하는 경로가 web path 뿐만아니라 app path가 존재하기 때문에 이를 모두 대응할 수 있도록 설계했습니다.

https://link.berriz.in/(web|app)/(main|shop)/*

link.berriz.in 뒤에 붙는 경로로 web path로 이동할 것인지 app path로 이동할 것인지 선택하고 서비스를 선택한 후에 main(berriz) or shop 뒤에 이동할 실제 경로를 붙여주면 됩니다. 예를 들어서 https://link.berriz.in/web/main/iu 를 공유하면 베리즈 서비스 웹 경로 iu 커뮤니티로 랜딩하게 됩니다.

유니버셜/앱 링크와 커스텀 스킴 함께 사용

앱이 설치되어있는 경우 대부분의 유저가 유니버셜/앱 링크를 타고 앱으로 바로 진입하게 되고, PC로 게이트 페이지에 진입한 경우 해당 path로 만들어진 QR을 통해 핸드폰으로 바로 앱으로 진입할 수 있게 합니다. 이 때 앱이 설치된 유저는 앱으로 진입, 앱이 설치되지않은 유저는 앱 설치를 유도합니다. 카카오톡의 인앱 브라우저와 같이 유니버셜/앱링크가 동작하지 않는 경우에는 link.berriz.in(게이트 페이지)로 이동하고 해당 페이지에서 유니버셜/앱링크의 fallback으로 커스텀 스킴을 호출합니다. 커스텀 스킴은 앱이 설치된 유저에게 팝업으로 앱으로 이동할 것인지 묻습니다. 하지만 앱이 설치되어있지 않으면 무시될 것이고 앱설치를 유도하기 위해 스토어를 오픈합니다.

flowchart