Android의 WebAPK

사용자가 Android의 홈 화면에 프로그레시브 웹 앱을 추가하면 Chrome에서 자동으로 APK를 생성하며, 이를 WebAPK라고도 합니다. APK를 통해 설치하면 앱이 앱 런처, Android 앱 설정에 표시되고 인텐트 필터 집합을 등록할 수 있습니다.

Android에 PWA를 설치하면 사용자의 홈 화면에 프로그레시브 웹 앱을 추가하는 것 이상의 작업이 가능합니다. Chrome은 앱의 특수 APK를 자동으로 생성하고 설치합니다. 이를 WebAPK라고도 합니다. APK를 통해 설치하면 앱이 앱 런처, Android 앱 설정에 표시되고 인텐트 필터 집합을 등록할 수 있습니다.

WebAPK를 생성하기 위해 Chrome은 웹 앱 매니페스트와 기타 메타데이터를 확인합니다. 매니페스트 업데이트가 감지되면 Chrome에서 새 APK를 생성해야 합니다.

Android 인텐트 필터

Android에 프로그레시브 웹 앱을 설치하면 앱 범위 내의 모든 URL에 대한 인텐트 필터 집합이 등록됩니다. 사용자가 앱 범위 내에 있는 링크를 클릭하면 브라우저 탭에서 앱이 열리지 않고 앱이 열립니다.

다음과 같은 부분 manifest.json를 살펴보세요.

"start_url": "/",
"display": "standalone",

이를 사용하는 웹 앱이 앱 런처에서 실행되면 브라우저 Chrome 없이 https://example.com/가 독립형 앱으로 열립니다.

WebAPK에는 다음과 같은 인텐트 필터가 포함됩니다.

<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data
    android:scheme="https"
    android:host="example.com"
    android:pathPrefix="/" />
</intent-filter>

사용자가 설치된 앱 내에서 https://example.com/read로 연결되는 링크를 클릭하면 앱이 인텐트에 포착되어 프로그레시브 웹 앱에서 열립니다.

scope를 사용하여 인텐트 필터 제한

프로그레시브 웹 앱에서 사이트 내의 모든 URL을 처리하지 않도록 하려면 scope 속성을 웹 앱 매니페스트에 추가하면 됩니다. scope 속성은 URL이 origin + scope와 일치하는 경우에만 Android에 웹 앱을 열라고 지시합니다. 앱에서 처리할 URL과 브라우저에서 열어야 하는 URL을 제어할 수 있습니다. 이는 앱과 기타 앱이 아닌 콘텐츠가 동일한 도메인에 있을 때 유용합니다.

다음과 같은 부분 manifest.json를 살펴보세요.

"scope": "/app/",
"start_url": "/app/",
"display": "standalone",

앱 런처에서 실행하면 https://example.com/app/가 브라우저 Chrome 없이 독립형 앱으로 열립니다.

이전과 마찬가지로 생성된 WebAPK는 인텐트 필터를 포함하지만 APK의 AndroidManifest.xml에 다른 android:pathPrefix 속성을 포함합니다.

<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data
    android:scheme="https"
    android:host="example.com"
    android:pathPrefix="/app/" />
</intent-filter>

몇 가지 예를 살펴보겠습니다.

의견을 제시하지

https://example.com/app/ - /app/

의견을 제시하지

https://example.com/app/read/book - /app/

금지사항

https://example.com/help/ - /app/에 없음

금지사항

https://example.com/about/ - /app/에 없음

scope 자세한 내용은 scope, 설정하지 않으면 어떻게 되는지, 이를 사용하여 앱 범위를 정의하는 방법을 참고하세요.

권한 관리

권한은 다른 웹 앱과 동일한 방식으로 작동하며 설치 시 요청할 수 없습니다. 런타임 시 요청해야 하며, 실제로 필요할 때만 요청하는 것이 좋습니다. 예를 들어 처음 로드할 때 카메라 권한을 요청하지 말고 사용자가 사진 촬영을 시도할 때까지 기다립니다.

저장소 및 앱 상태 관리

프로그레시브 웹 앱이 APK를 통해 설치되더라도 Chrome은 현재 프로필을 사용하여 데이터를 저장하며 분리되지 않습니다. 이를 통해 브라우저와 설치된 앱 간에 환경이 공유됩니다. 쿠키가 공유 및 활성화되고, 모든 클라이언트 측 저장소에 액세스할 수 있으며, 서비스 워커가 설치되고 바로 사용할 수 있습니다.

WebAPK 업데이트

WebAPK 업데이트 방법에 관한 정보는 Chrome에서 웹 앱 매니페스트 업데이트를 처리하는 방법으로 이동했습니다.

자주 묻는 질문(FAQ)

스플래시 화면을 생성하는 데 사용되는 아이콘은 무엇인가요? :
스플래시 화면에는 최소 2개의 아이콘(192px 및 512px)을 제공하는 것이 좋습니다. 스플래시 화면의 아이콘이 너무 작다는 의견이 있었습니다. Chrome 71 이상에서 생성된 WebAPK는 스플래시 화면에 더 큰 아이콘이 표시됩니다. 권장 아이콘이 제공되기만 하면 별도로 취해야 할 조치는 없습니다.
사용자가 사이트의 네이티브 앱을 이미 설치한 경우 어떻게 되나요?
현재 '홈 화면에 추가'처럼 사용자는 네이티브 앱과는 별개로 사이트를 추가할 수 있습니다. 사용자가 두 앱을 모두 설치할 것으로 예상된다면 네이티브 앱과 사이트의 아이콘 또는 이름을 구분하는 것이 좋습니다.
사용자가 Chrome의 캐시를 지우면 설치된 사이트의 저장공간이 삭제되나요?
예.
새 기기를 구매하면 앱이 다시 설치되나요?
지금은 불가능하지만, Google은 이 영역이 중요한 분야라고 생각하며 이를 작동할 방법을 조사하고 있습니다.
권한은 어떻게 처리되나요? Chrome 메시지 또는 Android 메시지가 표시되나요?
권한은 Chrome을 통해 계속 관리됩니다. 사용자에게 권한을 부여하라는 Chrome 메시지가 표시되며 Chrome 설정에서 이를 수정할 수 있습니다.
이 기능은 어떤 Android 버전에서 작동하나요?
프로그레시브 웹 앱은 Android용 Chrome, 특히 Jelly Bean 이상을 실행하는 모든 Android 버전에 설치할 수 있습니다.
WebView를 사용하나요?
아니요. 사이트는 사용자가 사이트를 추가할 때 사용한 Chrome 버전에서 열립니다.
생성된 APK를 Play 스토어에 업로드할 수 있나요?
아니요. 자체 APK를 업로드하려면 신뢰할 수 있는 웹 활동을 확인하세요.
Play 스토어에 등록되어 있나요?
아니요. Play 스토어에 등록할 자체 APK를 업로드하려면 신뢰할 수 있는 웹 활동을 확인하세요.
Android의 다른 브라우저 개발자입니다. 원활한 설치 프로세스를 진행할 수 있나요? :
문제 해결을 위해 노력 중입니다. Google은 Android의 모든 브라우저에서 이 기능을 사용할 수 있도록 하기 위해 노력하고 있으며, 곧 세부정보를 발표할 예정입니다.