빠른 시작 가이드

Peter Conn
Peter Conn

신뢰할 수 있는 웹 활동은 설정하기가 다소 까다로울 수 있으며, 특히 원하는 것이 웹사이트를 표시하세요 이 가이드에서는 신뢰할 수 있는 웹 활동을 사용하는 기본 프로젝트를 만드는 방법을 안내하고 해답을 찾을 수 있습니다.

이 가이드를 완료하면 다음을 수행할 수 있습니다.

  • Bubblewrap을 사용해 애플리케이션 빌드한 경험이 있는 사용자 신뢰할 수 있는 웹 활동을 사용하고 인증을 통과합니다.
  • 서명 키 사용 시기를 파악하세요.
  • Android 애플리케이션을 빌드할 때 사용하는 서명을 확인할 수 있어야 합니다.
  • 기본 디지털 애셋 링크 파일을 만드는 방법을 알아야 합니다.

이 가이드를 따르려면 다음이 필요합니다.

  • 개발 컴퓨터에 Node.js 10 이상 설치
  • 개발용으로 설정 및 연결된 Android 휴대전화 또는 에뮬레이터 (USB 디버깅을 사용 설정해야 하는 경우 실제 휴대전화를 사용하는 경우).
  • 개발용 휴대전화에서 신뢰할 수 있는 웹 활동을 지원하는 브라우저 Chrome 72 이상에서 작동합니다. 다른 브라우저에서도 지원될 예정입니다.
  • 신뢰할 수 있는 웹 활동에서 보려는 웹사이트입니다.

신뢰할 수 있는 웹 활동을 사용하면 Android 앱에서 별도의 작업 없이도 전체 화면 브라우저 탭을 실행할 수 있습니다. 사용할 수 있습니다. 이 기능은 소유하고 있는 웹사이트로 제한되며 사용자는 다음을 설정하여 이를 증명할 수 있습니다. 자세히 알아보겠습니다. 자세한 내용은 나중에 살펴보겠습니다.

신뢰할 수 있는 웹 활동을 실행하면 브라우저에서는 디지털 애셋 링크가 이를 인증이라고 합니다. 확인에 실패하면 브라우저는 웹사이트를 다시 맞춤 탭.

버블랩 설치 및 구성

Bubblewrap은 라이브러리 및 명령어 집합으로, 개발자가 프로그레시브 웹 앱을 생성, 빌드 및 실행하는 데 도움이 되는 Node.js용 라인 도구 (CLI) 신뢰할 수 있는 웹 활동 사용

이 CLI는 다음 명령어를 사용하여 설치할 수 있습니다.

npm i -g @bubblewrap/cli

환경 설정

Bubblewrap을 처음 실행하면 자동으로 Bubblewrap을 다운로드하고 필수 외부 종속 항목이 포함되어 있습니다 도구에서 이렇게 하도록 허용하는 것이 좋습니다. 이렇게 하면 종속 항목이 올바르게 구성되어 있는지 확인합니다 Bubblewrap 문서를 참고하여 기존 JDK (Java Development Kit) 또는 Android 명령줄 도구 설치

프로젝트 초기화 및 빌드

PWA를 래핑하는 Android 프로젝트를 초기화하려면 다음과 같이 init 명령어를 실행합니다.

bubblewrap init --manifest=https://my-twa.com/manifest.json

Bubblewrap은 웹 매니페스트를 읽습니다. 개발자에게 Android 프로젝트에서 사용할 값을 확인하도록 요청하고 확인할 수 있습니다. 프로젝트가 생성되면 다음을 실행하여 APK를 생성합니다.

bubblewrap build

실행

빌드 단계는 app-release-signed.apk라는 파일을 출력합니다. 이 파일은 테스트용 개발 기기 또는 출시를 위해 Play 스토어에 업로드

버블랩은 로컬 기기에 애플리케이션을 설치하고 테스트하는 명령어를 제공합니다. 다음 명령어를 실행하여 컴퓨터에 연결된 개발 기기를 설치합니다.

bubblewrap install

또는 adb 도구는 다음과 같습니다. 있습니다.

adb install app-release-signed.apk

이제 기기 런처에서 애플리케이션을 사용할 수 있습니다. 애플리케이션을 열면 웹사이트가 신뢰할 수 있는 웹 활동이 아니라 맞춤 탭으로 실행되는 것을 볼 수 있습니다. 아직 디지털 애셋 링크 유효성 검사를 설정하지 않았기 때문입니다. 하지만 먼저...

버블랩의 그래픽 사용자 인터페이스 (GUI) 대안

PWA 빌더는 버블랩을 사용하는 GUI 인터페이스를 제공합니다. 신뢰할 수 있는 웹 활동 프로젝트 생성을 강화해 줍니다. 방법에 대한 자세한 안내를 확인하세요. PWA 빌더를 사용하여 PWA를 여는 Android 앱 만들기 이 블로그 게시물을 참고하세요.

서명 키 관련 참고사항

디지털 애셋 링크는 APK가 서명될 때 사용된 키를 고려하며, 일반적인 인증 실패 원인은 잘못된 서명을 사용하기 때문입니다. 인증에 실패하면 웹사이트가 페이지 상단에 브라우저 UI가 있는 맞춤 탭으로 실행됩니다. Bubblewrap이 애플리케이션을 빌드하면 init 단계 중에 키가 설정된 APK가 생성됩니다. 하지만 Google Play에 앱을 게시하면 서명 키 처리 방법에 따라 다른 키가 생성될 수 있습니다. 서명 키 및 서명 키가 Bubblewrap 및 Google Play와의 관계에 관해 자세히 알아보세요.

디지털 애셋 링크는 기본적으로 앱 및 웹사이트를 가리키는 앱의 메타데이터입니다.

assetlinks.json 파일을 만든 후 브라우저에서 앱을 제대로 확인할 수 있도록 루트를 기준으로 .well-known/assetlinks.json의 웹사이트에 업로드합니다. 서명 키와의 관계에 관한 자세한 내용은 디지털 애셋 링크에 관한 심층 분석을 참고하세요.

브라우저 확인 중

신뢰할 수 있는 웹 활동은 사용자가 기본 선택한 브라우저를 준수하려고 시도합니다. 사용자의 기본 브라우저가 신뢰할 수 있는 웹 활동을 지원하는 경우 해당 브라우저가 실행됩니다. 실패하면 설치된 브라우저가 신뢰할 수 있는 웹 활동을 지원하는 경우 선택됩니다. 마지막으로 맞춤 탭 모드로 돌아가는 것이 기본 동작입니다.

즉, 신뢰할 수 있는 웹 활동과 관련된 무언가를 디버깅하는 경우 자신이 사용하는 브라우저를 사용하고 있는지 확인하세요. 다음 명령어를 사용하여 사용 중인 브라우저를 확인할 수 있습니다.

> adb logcat -v brief | grep -e TWAProviderPicker
D/TWAProviderPicker(17168): Found TWA provider, finishing search: com.google.android.apps.chrome

다음 단계

이 가이드를 따르면 신뢰할 수 있는 웹 활동이 정상적으로 작동하고 디버깅할 수 있는 지식이 필요합니다. 그렇지 않은 경우 웹 개발자를 위한 Android 개념을 자세히 살펴보거나 이 문서를 참고하세요.

다음 단계로 시작하는 것이 좋습니다. 앱 아이콘을 만듭니다. 그런 다음 Play 스토어에 앱을 배포할 수 있습니다.