핸들러 API 실행

앱 실행 방법을 제어합니다.

토마스 슈타이너
토마스 슈타이너

Launch Handler API를 사용하면 앱이 실행되는 방법(예: 기존 창 또는 새 창을 사용할지, 선택한 창을 실행 URL로 이동할지 여부)을 제어할 수 있습니다. File Handing API와 마찬가지로 이 메서드는 실행된 페이지의 window.launchQueue에도 LaunchParams 객체를 큐에 추가합니다.

현재 상태

단계 상태
1. 설명 만들기 완료
2. 사양의 초기 초안 만들기 완료
3. 의견 수집 및 디자인 반복 완전함
4. 오리진 트라이얼 완전함
5. 출시 완료

Launch Handler API 사용

브라우저 지원

핸들러 실행은 ChromeOS에서만 사용할 수 있습니다.

브라우저 지원

  • 110
  • 110
  • x
  • x

소스

인터페이스

Launch Handler API는 두 가지 새로운 인터페이스를 정의합니다.

LaunchParams : 소비자가 처리할 targetURL가 포함된 객체입니다. LaunchQueue : 지정된 소비자가 대기열을 처리할 때까지 대기열이 실행됩니다.

launch_handler 매니페스트 멤버

앱의 시작 동작을 선언적으로 지정하려면 launch_handler 매니페스트 멤버를 매니페스트에 추가합니다. 여기에는 client_mode라는 하위 필드가 하나 있습니다. 이를 통해 새 클라이언트를 실행할지 기존 클라이언트를 시작할지 여부와 이 클라이언트의 이동 여부를 제어할 수 있습니다. 아래 예는 항상 모든 실행을 새 클라이언트로 라우팅하는 예시 값을 포함하는 파일을 보여줍니다.

{
  "launch_handler": {
    "client_mode": "navigate-new"
  }
}

지정하지 않으면 launch_handler의 기본값은 {"client_mode": "auto"}입니다. 하위 필드에 허용되는 값은 다음과 같습니다.

  • client_mode:
    • navigate-new: 출시의 타겟 URL을 로드하기 위해 새로운 탐색 컨텍스트가 웹 앱 창에 생성됩니다.
    • navigate-existing: 웹 앱 창에서 탐색 컨텍스트와 가장 최근에 상호작용한 항목이 실행의 타겟 URL로 이동합니다.
    • focus-existing: 웹 앱 창에서 탐색 컨텍스트와 가장 최근에 상호작용한 항목이 실행을 처리하기 위해 선택됩니다. targetURL가 시작 URL로 설정된 새 LaunchParams 객체는 문서의 window.launchQueue에 추가됩니다.
    • auto: 어떤 동작이 플랫폼에 가장 적합한지 결정하는 것은 사용자 에이전트에 달려 있습니다. 예를 들어 휴대기기는 단일 클라이언트만 지원하고 existing-client를 사용하는 반면 데스크톱 기기는 여러 창을 지원하고 navigate-new를 사용하여 데이터 손실을 방지합니다.

client_mode 속성은 값 목록 (배열)도 허용하며 여기서 첫 번째 유효한 값이 사용됩니다. 이는 기존 구현과의 하위 호환성을 손상하지 않고 새 값을 사양에 추가할 수 있도록 하기 위함입니다.

예를 들어 가상의 값 "focus-matching-url"를 추가하면 사이트에서 "client_mode": ["focus-matching-url", "navigate-existing"]를 지정하여 "focus-matching-url"를 지원하지 않는 이전 브라우저의 동작을 계속 제어합니다.

window.launchQueue 사용

다음 코드에서 extractSongID() 함수는 실행 시 전달된 URL에서 songID를 추출합니다. 음악 플레이어 PWA에서 노래를 재생할 때 사용합니다.

if ('launchQueue' in window) {
  launchQueue.setConsumer((launchParams) => {
    if (launchParams.targetURL) {
      const songID = extractSongId(launchParams.targetURL);
      if (songID) {
        playSong(songID);
      }
    }
  });
}

데모

PWA 실행 핸들러 데모에서 실행 핸들러 API의 데모를 볼 수 있습니다. 애플리케이션의 소스 코드에서 Launch Handler API를 사용하는 방법을 확인하세요.

  1. ChromeOS 기기에 Musicr 2.0 앱을 설치합니다.
  2. https://launch-handler.glitch.me?track=https://example.com/music.mp3 형식의 채팅 애플리케이션에서 본인에게 링크를 전송합니다. 오디오 파일을 가리키는 모든 URL에 대해 https://example.com/music.mp3를 맞춤설정할 수 있습니다(예: https://launch-handler.glitch.me?track=https://cdn.glitch.me/3e952c9c-4d6d-4de4-9873-23cf976b422e%2Ffile_example_MP3_700KB.mp3?v=1638795977190).
  3. 채팅 앱에서 링크를 클릭하면 Musicr 2.0이 열리고 트랙이 재생되는 것을 확인합니다.
  4. 채팅 앱에서 링크를 다시 클릭하면 Musicr 2.0의 두 번째 인스턴스를 가져올 수 없습니다.

의견

Chromium팀에 Launch Handler API 사용 경험에 관한 의견을 듣고자 합니다.

API 설계에 대해 알려주세요.

API에 예상한 대로 작동하지 않는 부분이 있나요? 아니면 아이디어를 구현하는 데 필요한 메서드나 속성이 누락되었나요? 보안 모델에 대한 질문이나 의견이 있으신가요? 해당 GitHub 저장소에 사양 문제를 제출하거나 기존 문제에 대한 의견을 추가하세요.

구현 관련 문제 신고

Chromium의 구현에서 버그를 발견하셨나요? 아니면 구현이 사양과 다른가요? new.crbug.com에서 버그를 신고합니다. 가능한 한 많은 세부정보와 간단한 재현 안내를 포함하고 Components 상자에 Blink>AppManifest를 입력합니다. Glitch는 빠르고 쉬운 재현을 공유하는 데 효과적입니다.

API 지원 표시

Launch Handler API를 사용할 계획인가요? 공개 지원은 Chromium팀이 기능의 우선순위를 정하는 데 도움이 되며 다른 브라우저 공급업체에 이러한 기능을 지원하는 것이 얼마나 중요한지 알려줍니다.

해시태그 #LaunchHandler를 사용하여 @ChromiumDev로 트윗을 보내주시고 어디에서 어떻게 사용하고 계신지 알려주세요.

유용한 링크