나는 이렇게 학습한다/Frontend

Intent URL로 Android 외부 브라우저로 리다이렉트하기

daco2020 2024. 9. 2. 23:56
반응형

웹 애플리케이션을 개발할 때, 특히 Android 환경에서 인앱 브라우저 대신 외부 브라우저(주로 Chrome)로 사용자를 강제 이동시켜야 하는 상황이 종종 발생합니다. 이 글에서는 Android의 Intent를 활용해 외부 브라우저로 리다이렉트하는 방법을 살펴보겠습니다.

 

 

Intent URL을 사용한 외부 브라우저 리다이렉트

아래는 Android 디바이스에서 특정 URL을 외부 브라우저로 열기 위해 Intent URL을 생성하는 코드입니다.

const currentUrl = window.location.href;
const redirectUrl =
  "intent://domain.co.kr/#Intent;scheme=https;package=com.android.chrome;S.browser_fallback_url=" +
  encodeURIComponent(currentUrl) +
  ";end";

window.location.replace(redirectUrl);

 

 

각 부분의 의미

  1. "intent://domain.co.kr/":
    • intent://로 시작하는 이 부분은 안드로이드에서 Intent 프로토콜을 사용하여 외부 애플리케이션을 호출한다는 것을 의미합니다.
    • domain.co.kr은 리다이렉트하고자 하는 기본 URL을 나타내며, 실제로는 사용자가 방문하려는 사이트의 도메인으로 대체될 수 있습니다.
  2. "#Intent":
    • #Intent는 Android의 Intent 체계를 시작하겠다는 신호입니다. 이 부분부터 시작해서 뒤에 오는 모든 내용은 Intent의 매개변수로 해석됩니다.
  3. "scheme=https;":
    • scheme=https;는 이 Intent가 HTTPS 스킴을 사용해 브라우저에서 열릴 것이라는 것을 지정합니다. 이는 URL이 https://로 시작한다는 의미와 동일합니다.
  4. "package=com.android.chrome;":
    • package=com.android.chrome;는 이 Intent가 특정 앱(여기서는 Chrome)에서 열리도록 지정하는 부분입니다. 이 덕분에, Android는 사용자가 현재 Chrome 앱을 통해 이 URL을 열도록 강제할 수 있습니다.
  5. "S.browser_fallback_url=" + encodeURIComponent(currentUrl):
    • S.browser_fallback_url=는 만약 사용자가 지정한 앱(여기서는 Chrome)을 설치하지 않았거나, 그 앱이 정상적으로 작동하지 않는 경우에 대체할 URL을 지정하는 부분입니다.
    • encodeURIComponent(currentUrl)는 현재 페이지의 URL을 인코딩하여 이 URL이 유효한 형식으로 외부 브라우저에서 열릴 수 있도록 만듭니다. 이때, currentUrl은 사용자가 현재 보고 있는 페이지의 URL입니다.
  6. ";end":
    • ;end는 Intent 문자열의 끝을 나타내는 신호입니다. 이를 통해 Android는 Intent 구성 요소가 모두 완성되었음을 인식하게 됩니다.

 

 

동작 원리

이 Intent URL을 생성한 후, window.location.replace(redirectUrl)로 실행하면, Android는 이 Intent를 해석하여 지정된 외부 브라우저(주로 Chrome)에서 해당 URL을 열게 됩니다. 만약 Chrome이 설치되어 있지 않거나 열 수 없는 경우에는 S.browser_fallback_url에 지정된 URL을 기본 웹 브라우저에서 열도록 합니다.

 

이 방법을 사용하면 Android 인앱 브라우저에서 벗어나 외부 브라우저로 강제 이동이 가능해지며, 특히 사용자가 더 완전한 웹 경험을 필요로 하는 경우에 매우 유용합니다.

 

 

다른 예시: 특정 브라우저에서 URL 열기

다른 앱에서 URL을 열고 싶은 경우, package 값을 변경하면 됩니다. 예를 들어, Chrome 대신 Firefox에서 URL을 열고 싶다면 package=com.android.chrome; 부분을 package=org.mozilla.firefox;로 변경할 수 있습니다.

const currentUrl = window.location.href;
const redirectUrl =
  "intent://domain.co.kr/#Intent;scheme=https;package=org.mozilla.firefox;S.browser_fallback_url=" +
  encodeURIComponent(currentUrl) +
  ";end";

window.location.replace(redirectUrl);

 

이 코드 역시 동일하게 동작하지만, 이번에는 Firefox에서 URL을 여는 것을 우선으로 합니다. 만약 Firefox가 설치되어 있지 않다면, 지정된 S.browser_fallback_url로 리다이렉트하게 됩니다.

 

 

결론

Android의 Intent 기능을 사용하면 사용자가 인앱 브라우저 대신 외부 브라우저에서 웹페이지를 열 수 있도록 강제할 수 있습니다. 이는 특히 특정 브라우저에서만 제대로 동작하는 기능을 제공하거나, 더 나은 사용자 경험을 제공하기 위해 필요할 때 유용합니다. 이 방법을 통해 Android 환경에서도 사용자에게 최적화된 웹 경험을 제공할 수 있습니다. 

반응형