다양한 구성요소를 사용하여 Android 앱 내에서 웹 콘텐츠를 렌더링하는 방법
Android 플랫폼은 10년 넘게 사용되어 왔으며 초기부터 웹을 적극적으로 지원해 왔습니다. WebView는 개발자가 자체 Android 앱 내에서 웹을 사용할 수 있는 구성요소로 제공되었습니다. 또한 Android를 사용하면 개발자가 자체 브라우저 엔진을 플랫폼에 가져와 경쟁과 혁신을 촉진할 수 있습니다.
개발자는 다양한 방법으로 Android 애플리케이션에 웹을 포함할 수 있습니다. WebView는 광고를 렌더링하는 데, Android UI 요소와 함께 사용되는 레이아웃 구성요소로, 또는 HTML 5 게임을 패키징하는 데 자주 사용됩니다. 맞춤 탭을 사용하면 개발자가 인앱 브라우저를 빌드하고 서드 파티 웹 콘텐츠에 원활한 탐색 환경을 제공할 수 있으며, 신뢰할 수 있는 웹 활동을 사용하면 개발자가 Play 스토어에서 다운로드할 수 있는 Android 앱에서 프로그레시브 웹 앱 (PWA)을 사용할 수 있습니다.
Android WebView
WebView를 사용하면 개발자가 Android 앱 내에서 최신 HTML, CSS, JavaScript에 액세스할 수 있으며 콘텐츠를 APK 내에서 제공하거나 인터넷에 호스팅할 수 있습니다. Android에서 가장 유연하고 강력한 구성요소 중 하나로, 웹 콘텐츠가 Android 앱에 포함된 대부분의 사용 사례에 사용할 수 있습니다. AdMob과 같은 광고 서비스를 지원하는 것부터 WebGL과 같은 최신 API를 사용하는 완전한 HTML5 게임을 빌드하고 출시하는 것까지 가능합니다.
하지만 인앱 브라우저를 만들거나 Android 애플리케이션에 PWA를 포함하는 데 사용하면 WebView에 웹 플랫폼의 보안, 기능, 성능이 없습니다.
인앱 브라우저 과제
시간이 지남에 따라 점점 더 많은 개발자가 서드 파티 웹사이트로 이동할 때 사용자에게 더 원활한 환경을 제공하기 위해 서드 파티 콘텐츠를 Android 애플리케이션에 통합하는 브라우저 환경을 빌드했습니다. 이러한 환경을 인앱 브라우저라고 했습니다.
WebView는 최신 웹 기술 스택을 광범위하게 지원하며 WebGL과 같은 여러 최신 웹 API를 지원합니다. 하지만 WebView는 기본적으로 웹 UI 도구 키트입니다. 웹 플랫폼의 모든 기능을 지원하기 위한 것이 아니며 실제로 지원하지도 않습니다. API에 이미 웹 블루투스와 같은 OS 수준의 대안이 있거나 푸시 알림과 같이 브라우저 UI가 구현되어야 하는 경우 지원되지 않을 수 있습니다. 웹 플랫폼이 발전하고 Android 앱에서만 사용할 수 있었던 기능이 더 많이 추가되면 이 격차는 더욱 커질 것입니다. 앱 개발자가 서드 파티 콘텐츠를 열 때 사용되는 기능을 제어할 수 없으므로 WebView는 인앱 브라우저나 프로그레시브 웹 앱을 열 때 적합하지 않습니다. WebView에서 모든 웹 플랫폼 기능에 대한 지원을 구현하더라도 개발자는 여전히 권한이나 푸시 알림과 같은 기능에 관한 코드를 작성하고 자체 UI를 구현해야 하므로 사용자에게 일관성을 제공하기가 어렵습니다.
WebView를 인앱 브라우저로 사용할 때의 보안 고려사항
WebView는 삽입 애플리케이션에 쿠키 및 DOM을 비롯한 렌더링된 콘텐츠에 대한 전체 액세스 권한을 부여합니다. 이러한 기능은 사용자의 높은 신뢰가 필요한 강력한 기능입니다.
WebView는 브라우저를 빌드하기 위한 프레임워크가 아니므로 최신 브라우저에서 사용할 수 있는 보안 기능이 없습니다.
멀티프로세스 아키텍처 및 사이트 격리
브라우저는 신뢰할 수 없는 콘텐츠를 렌더링하고 실행하는 동안 안전하도록 설계되었습니다. 신뢰할 수 없거나 악의적인 콘텐츠를 탐색하는 동안 사용자가 안전하게 보호되도록 하기 위해 최신 브라우저는 멀티프로세스 아키텍처 및 사이트 격리와 같은 기법을 사용합니다.
멀티프로세스 아키텍처가 없으면 웹페이지로 인한 비정상 종료로 인해 전체 브라우저 앱이 비정상 종료되거나 취약점이 악용되어 전체 기기를 제어할 수 있습니다. 사이트 격리를 사용하면 신뢰할 수 없는 사이트가 다른 사이트의 정보에 액세스하고 이를 도용하기가 더 어려워지는 보안 레이어가 추가됩니다.
Android 8.0 Oreo까지 WebView 렌더러는 삽입기 애플리케이션과 동일한 프로세스를 사용했습니다. 최신 버전의 OS에서 기기의 성능이 충분하면 렌더러가 다른 프로세스에서 실행됩니다. 하지만 여전히 모든 페이지와 이를 실행하는 WebView 인스턴스 간에 단일 프로세스가 공유되므로 사이트 격리를 완전히 구현할 수 없습니다.
멀티프로세스 아키텍처와 사이트 격리가 없다는 것은 소유하고 신뢰하는 콘텐츠를 렌더링하는 애플리케이션에는 문제가 되지 않지만, 인앱 브라우저와 같이 신뢰할 수 없는 서드 파티 콘텐츠를 실행하는 애플리케이션에는 문제가 될 수 있으며, 이는 쿠키, 은행 세부정보, 개인 정보 등을 훔치는 데 사용될 수 있는 멜트다운 및 Spectre와 같은 취약점에 사용자를 노출시킵니다.
보안 UI 표시기
사용자에게 우수한 보안 지표를 제공하는 것도 중요합니다. 브라우저는 이 분야에 많은 노력을 기울이고 항상 발전하고 있습니다. 그러나 WebView에는 애플리케이션 개발자가 신뢰할 수 있는 보안 지표를 빌드할 수 있도록 사이트의 연결이 안전한지 확인하는 API가 없습니다. 이러한 API가 없으면 주소 표시줄에 표시된 URL이 보안 HTTPS 연결을 통해서도 사용자에게 표시된 페이지와 일치하지 않을 수 있습니다.
개발자가 사용할 수 있는 또 다른 옵션은 애플리케이션에 브라우저 엔진을 삽입하는 것입니다. 이 접근 방식은 애플리케이션 크기를 늘리는 것 외에도 복잡하고 시간이 많이 걸립니다.
인앱 브라우저를 위한 솔루션으로 맞춤 탭
맞춤 탭은 Chrome 45에서 도입되었으며 개발자가 사용자의 기본 브라우저에 있는 탭을 애플리케이션의 일부로 사용할 수 있도록 합니다. 맞춤 탭은 원래 Chrome에서 출시되었기 때문에 'Chrome 맞춤 탭'이라고 불렸습니다. 현재는 Android API이며 Chrome, Firefox, Edge, Samsung Internet 등 대부분의 인기 브라우저에서 맞춤 탭을 지원하므로 '맞춤 탭'이라고 부르는 것이 더 적절합니다.
맞춤 탭을 사용하면 개발자가 웹 콘텐츠를 앱 환경에 원활하게 통합할 수 있습니다. 또한 개발자는 툴바 색상, 작업 버튼, 전환 애니메이션 등을 맞춤설정하여 웹 콘텐츠가 표시되는 활동을 맞춤설정할 수 있습니다.
또한 WebView를 사용하거나 브라우저 엔진을 삽입할 때 이전에 사용할 수 없었던 기능도 제공합니다. 인앱 브라우저는 사용자의 브라우저를 기반으로 하므로 맞춤 탭은 브라우저와 저장소를 공유하므로 사용자가 설치된 앱 중 하나가 인앱 브라우징 세션을 시작할 때마다 즐겨 찾는 웹사이트에 다시 로그인할 필요가 없습니다.
WebView와 달리 맞춤 탭은 이를 지원하는 브라우저에서 지원하는 모든 웹 플랫폼 기능과 API를 지원합니다.
신뢰할 수 있는 웹 활동을 사용하여 프로그레시브 웹 앱 열기
프로그레시브 웹 앱은 한때 플랫폼별 앱에서만 사용할 수 있었던 많은 동작과 기능을 웹에 제공합니다. 앱과 같은 동작이 도입되면서 개발자들이 Android에서 이러한 환경을 재사용하고자 하는 욕구가 커졌고, 개발자들은 PWA를 앱에 통합하는 방법을 문의하기 시작했습니다.
맞춤 탭은 모든 최신 웹 기능과 API를 지원하지만 기본적으로 서드 파티 콘텐츠를 열도록 설계되었으므로 상단에 사용자가 방문 중인 URL을 알려주는 툴바와 사이트의 보안 상태를 나타내는 자물쇠 아이콘이 있습니다. 앱 자체 환경을 열 때 툴바는 애플리케이션이 운영체제와 통합된 것처럼 느껴지지 않도록 합니다.
신뢰할 수 있는 웹 활동은 Chrome 72에서 도입되었으며 개발자가 Android 앱 내에서 PWA를 사용할 수 있도록 지원합니다. 프로토콜은 맞춤 탭 프로토콜과 유사하지만 개발자가 디지털 애셋 링크를 통해 Android 앱과 열려 있는 URL을 모두 제어하고 두 가지가 모두 true인 경우 URL 표시줄을 삭제할 수 있는 API를 도입합니다.
또한 PWA를 열 때 스플래시 화면을 만들거나 Android 코드에서 처리하도록 웹 알림을 위임하기 위한 API도 도입했습니다. Play 결제 지원과 같은 더 많은 기능이 곧 제공될 예정입니다.
신뢰할 수 있는 웹 활동에서 열리는 URL은 PWA이고 일련의 동작과 성능 특성을 갖는 것으로 예상되므로 신뢰할 수 있는 웹 활동은 내부에서 열리는 PWA에 대한 품질 기준을 도입합니다.
기존 솔루션의 제한사항
개발자 의견에 따르면 맞춤 탭의 플랫폼 호환성과 WebView의 유연성을 결합하여 인앱 브라우저에 DOM에 액세스하거나 JavaScript를 삽입할 수 있어야 한다고 합니다.
맞춤 탭은 맞춤 UI가 있거나 UI가 전혀 없는 사용자의 브라우저에서 렌더링되는 탭입니다. 즉, 브라우저는 브라우저에 대한 개인 정보 보호 및 보안에 관한 사용자의 기대를 충족해야 하므로 이러한 기능 중 일부는 불가능합니다.
Google의 Android용 웹팀은 이러한 사용 사례를 해결하기 위한 대안을 모색하고 솔루션을 실험하고 있습니다. 자세한 내용은 다시 알려드리겠습니다.
요약
WebView는 애플리케이션에 Android 앱 내에서 HTML, CSS, JavaScript가 필요하지만 푸시 알림, 웹 블루투스 등 최신 웹에서 제공되는 고급 기능을 사용하지 않는 경우에 유용합니다. 최신 웹 플랫폼용으로 설계된 콘텐츠를 열 때는 권장하지 않습니다. 개발자가 의도한 방식으로 표시되지 않을 수 있기 때문입니다. 인앱 브라우저를 만드는 데는 WebView를 사용하지 않는 것이 좋습니다. 반면 퍼스트 파티 웹 콘텐츠를 표시하는 것은 WebView가 빛을 발하는 영역입니다.
신뢰할 수 있는 웹 활동은 개발자가 Android 애플리케이션 내에서 자체 프로그레시브 웹 앱을 전체 화면으로 렌더링하려는 경우에 사용해야 합니다. 앱의 유일한 활동으로 사용하거나 다른 Android 활동과 함께 사용할 수 있습니다.
맞춤 탭은 인앱 브라우저라고도 하는 웹 플랫폼용으로 설계된 서드 파티 콘텐츠를 여는 데 권장되는 방법입니다.