Symbol
웹 런처의 적용 방법과 적용시 유의할 점
웹 런처에 대한 설명과 적용 방법에 대한 내용입니다.
2024-03-25

웹 런처란?

웹 런처란 간단히 말해 프로그램의 실행 버튼이 웹에 있는 것입니다.
보통 게임서비스에서 많이 사용하는 것을 볼 수 있습니다.

웹 런처의 장점

웹런처를 도입하면 프로그램을 실행할 때 일단 웹에 접속해야 하므로 사이트의 트래픽이 증가하고 공지와 광고 등의 효과를 높일 수 있습니다.

URL Scheme

웹 런처를 도입하려면 우선 프로그램에 URL Scheme가 적용되어 있어야 합니다.
URL Scheme는 프로그램 개발자가 적용하고 웹개발자에게 제공해주어야 하는 것이므로 이것에 대해 다루지는 않겠습니다.
프로그램에 URL Scheme가 존재한다면 웹에서는 일반 URL 링크를 걸듯이 anchor태그 href속성에 프로그램 URL을 할당해줍니다.

위 코드에서 app_scheme 부분이 프로그램의 URL Scheme 입니다.
URL Scheme 뒤로는 실행시 parameter를 프로그램으로 전달할 수 있습니다.

프로그램 설치 여부 판별하기

웹 런처로 프로그램을 실행하기 전 해당 PC에 프로그램이 설치되어 있는지 여부를 판별하여 프로그램을 실행과 설치 동작을 나누고 싶었습니다.
그렇지만 사실 웹에서 PC에 프로그램이 설치되어 있는지 100% 판별할 수 있는 방법은 없습니다.
그저 몇가지 단서들을 가지고 설치여부를 유추해야 합니다.
많이 쓰이는 방식중 하나는 focus를 이용하는 것입니다.
일단 설치여부와 상관없이 프로그램을 실행시킨 후 focus가 브라우저에서 사라졌다면 프로그램이 실행된 것으로, 그대로 남아있다면 미설치된 것으로 간주합니다.
브라우저에 focus가 있는지를 판별하는 방법은 javascript의 document.hasFocus 를 사용합니다.

앱이 설치되어 있다면 아래처럼 실행하겠냐고 묻는 컨펌창이 생기면서 브라우저는 focus를 잃습니다.

유의할 점

앱이 설치되어 있지 않아도 아래 조건을 모두 충족하면 브라우저의 focus가 사라집니다.
  1. 항상 연결된 앱 링크를 열도록 허용
  2. "사용자 계정 컨트롤 설정"의 레벨이 알리지 않음으로 설정
위 두가지 조건을 충족했다면 앱이 설치되어 있지 않아도 아래와 같은 운영체제 다이얼로그 박스가 팝업되면서 브라우저는 focus를 잃게 됩니다.

결론

결국 웹에서 프로그램이 설치되어 있는지 여부를 100% 판별할 수 있는 방법은 없기 때문에 서비스는 유저가 프로그램 실행 버튼을 클릭했을 때 "실행" 을 함과 동시에 프로그램을 다운로드 할 수 있는 UI를 같이 제공해주어야 합니다.
-- 끝 --