사용자가 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",
이를 사용하는 웹 앱이 앱 런처에서 실행되면 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/
이 열립니다.
이전과 마찬가지로 생성된 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
를 설정하지 않으면 어떻게 되는지, scope
를 사용하여 앱 범위를 정의하는 방법에 관한 자세한 내용은 scope
를 참고하세요.
권한 관리
권한은 다른 웹 앱과 동일한 방식으로 작동하며 설치 시 요청할 수 없습니다. 대신 런타임에 요청해야 하며, 가능하면 실제로 필요한 경우에만 요청해야 합니다. 예를 들어 첫 로드 시 카메라 권한을 요청하지 말고 대신 사용자가 사진을 찍으려고 할 때까지 기다리세요.
저장소 및 앱 상태 관리
프로그레시브 웹 앱이 APK를 통해 설치되더라도 Chrome은 현재 프로필을 사용하여 데이터를 저장하며, 데이터는 분리되지 않습니다. 이렇게 하면 브라우저와 설치된 앱 간에 공유 환경을 사용할 수 있습니다. 쿠키가 공유되고 활성 상태이며 모든 클라이언트 측 저장소에 액세스할 수 있고 서비스 워커가 설치되어 실행 준비가 됩니다.
WebAPK 업데이트
WebAPK 업데이트 방법에 관한 정보는 Chrome에서 웹 앱 매니페스트 업데이트를 처리하는 방법으로 이동했습니다.
자주 묻는 질문(FAQ)
- 스플래시 화면을 생성하는 데 사용되는 아이콘은 무엇인가요? :
- 플래시 화면에는 192픽셀 및 512픽셀 아이콘을 2개 이상 제공하는 것이 좋습니다. 스플래시 화면의 아이콘이 너무 작다는 사용자의 의견이 접수되었습니다. Chrome 71 이상에서 생성된 WebAPK는 스플래시 화면에 더 큰 아이콘을 표시합니다. 권장 아이콘이 제공되는 한 별도의 조치를 취할 필요가 없습니다.
- 사용자가 사이트의 네이티브 앱을 이미 설치한 경우 어떻게 되나요?
- 현재의 홈 화면에 추가와 마찬가지로 사용자가 네이티브 앱과 관계없이 사이트를 추가할 수 있습니다. 사용자가 둘 다 설치할 가능성이 있는 경우 사이트의 아이콘이나 이름을 네이티브 앱과 구분하는 것이 좋습니다.
- 사용자가 Chrome의 캐시를 지우면 설치된 사이트의 저장용량이 삭제되나요?
- 예.
- 새 기기를 구매하면 앱이 다시 설치되나요?
- 현재는 지원되지 않지만 중요한 영역이라고 생각하며 이를 지원할 방법을 모색하고 있습니다.
- 권한은 어떻게 처리되나요? Chrome 메시지가 표시되나요, 아니면 Android 메시지가 표시되나요?
- 권한은 계속 Chrome을 통해 관리됩니다. 사용자에게 권한을 부여하라는 Chrome 메시지가 표시되며 Chrome 설정에서 권한을 수정할 수 있습니다.
- 이 기능은 어떤 Android 버전에서 작동하나요?
- 프로그레시브 웹 앱은 Android용 Chrome을 실행하는 모든 Android 버전(특히 Jelly Bean 이상)에 설치할 수 있습니다.
- WebView를 사용하나요?
- 아니요. 사이트는 사용자가 사이트를 추가한 Chrome 버전에서 열립니다.
- 생성된 APK를 Play 스토어에 업로드할 수 있나요?
- 아니요. 자체 APK를 업로드하려면 신뢰할 수 있는 웹 활동을 확인하세요.
- Play 스토어에 표시되나요?
- 아니요. Play 스토어에 등록하기 위해 자체 APK를 업로드하려면 신뢰할 수 있는 웹 활동을 확인하세요.
- Android용 다른 브라우저의 개발자입니다. 이처럼 원활한 설치 프로세스를 사용할 수 있나요? :
- 문제를 해결하기 위해 노력하고 있습니다. Google은 Android의 모든 브라우저에서 이 기능을 사용할 수 있도록 최선을 다하고 있으며 곧 자세한 내용을 공유해 드리겠습니다.