API de Launch Handler

Controla cómo se inicia tu app.

Thomas Steiner

La API de Launch Handler te permite controlar cómo se inicia tu app, por ejemplo, si usa una ventana existente o una nueva, y si se navega a la URL de inicio en la ventana elegida. Al igual que con la API de File Handing, esto también pone en cola un objeto LaunchParams en el window.launchQueue de la página iniciada.

Estado actual

Paso Estado
1. Crea un video explicativo Completar
2. Crea un borrador inicial de la especificación Completar
3. Recopila comentarios y itera en el diseño Completado
4. Prueba de origen Completado
5. Lanzamiento Completar

Usa la API de Launch Handler

Navegadores compatibles

Navegadores compatibles

  • Chrome: 110.
  • Edge: 110.
  • Firefox: No es compatible.
  • Safari: No se admite.

Origen

Interfaces

La API de Launch Handler define dos interfaces nuevas.

LaunchParams : Es un objeto que contiene el targetURL que el consumidor debe controlar. LaunchQueue : Las filas se inician hasta que el consumidor especificado las controla.

El miembro del manifiesto launch_handler

Para especificar de forma declarativa el comportamiento de inicio de tu app, agrega el miembro del manifiesto launch_handler a tu manifiesto. Tiene un subcampo llamado client_mode. Te permite controlar si se debe iniciar un cliente nuevo o uno existente, y si se debe navegar por este cliente. En el siguiente ejemplo, se muestra un archivo con valores ejemplares que siempre enrutarían todos los lanzamientos a un cliente nuevo.

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

Si no se especifica, el valor predeterminado de launch_handler es {"client_mode": "auto"}. Los valores permitidos para los subcampos son los siguientes:

  • client_mode:
    • navigate-new: Se crea un nuevo contexto de navegación en una ventana de la app web para cargar la URL de destino del inicio.
    • navigate-existing: Se navega a la URL de destino del lanzamiento desde el contexto de navegación con el que se interactuó más recientemente en una ventana de la app web.
    • focus-existing: Se elige el contexto de navegación con el que se interactuó más recientemente en una ventana de la app web para controlar el inicio. Se pondrá en cola un nuevo objeto LaunchParams con su targetURL establecido en la URL de lanzamiento en el window.launchQueue del documento.
    • auto: El usuario-agente decide qué funciona mejor para la plataforma. Por ejemplo, los dispositivos móviles solo admiten clientes únicos y usarían existing-client, mientras que los dispositivos de escritorio admiten varias ventanas y usarían navigate-new para evitar la pérdida de datos.

La propiedad client_mode también acepta una lista (array) de valores, en la que se usará el primer valor válido. Esto permite agregar valores nuevos a la especificación sin romper la retrocompatibilidad con las implementaciones existentes.

Por ejemplo, si se agregara el valor hipotético "focus-matching-url", los sitios especificarían "client_mode": ["focus-matching-url", "navigate-existing"] para seguir controlando el comportamiento de los navegadores más antiguos que no admiten "focus-matching-url".

Usa window.launchQueue

En el siguiente código, la función extractSongID() extrae un songID de la URL que se pasa en el inicio. Se usa para reproducir una canción en una AWP de reproductor de música.

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

Demostración

Puedes ver una demostración de la API de Launch Handler en acción en la demostración de Launch Handler de PWA. Asegúrate de revisar el código fuente de la aplicación para ver cómo usa la API de Launch Handler.

  1. Instala la app de Musicr 2.0.
  2. Envíate un vínculo en una aplicación de chat con el formato https://launch-handler.glitch.me?track=https://example.com/music.mp3. (Puedes personalizar https://example.com/music.mp3 para cualquier URL que dirija a un archivo de audio, por ejemplo, https://launch-handler.glitch.me?track=https://cdn.glitch.me/3e952c9c-4d6d-4de4-9873-23cf976b422e%2Ffile_example_MP3_700KB.mp3?v=1638795977190).
  3. Haz clic en el vínculo de la app de chat y observa cómo se abre Musicr 2.0 y se reproduce la pista.
  4. Vuelve a hacer clic en el vínculo de tu app de chat y observa que no obtendrás una segunda instancia de Musicr 2.0.

Comentarios

El equipo de Chromium quiere conocer tus experiencias con la API de Launch Handler.

Cuéntanos sobre el diseño de la API

¿Hay algo en la API que no funciona como esperabas? ¿O faltan métodos o propiedades que necesitas para implementar tu idea? ¿Tienes alguna pregunta o comentario sobre el modelo de seguridad? Informa un problema de especificación en el repositorio de GitHub correspondiente o agrega tus comentarios a un problema existente.

Denuncia un problema con la implementación

¿Encontraste un error con la implementación de Chromium? ¿O la implementación es diferente de la especificación? Informa un error en new.crbug.com. Asegúrate de incluir tantos detalles como sea posible, instrucciones para reproducirlo y, luego, ingresa Blink>AppManifest en el cuadro Componentes. Glitch es excelente para compartir reproducciones rápidas.

Cómo mostrar compatibilidad con la API

¿Piensas usar la API de Launch Handler? Tu apoyo público ayuda al equipo de Chromium a priorizar las funciones y les muestra a otros proveedores de navegadores lo importante que es admitirlas.

Envía un tuit a @ChromiumDev con el hashtag #LaunchHandler y cuéntanos dónde y cómo lo usas.

Vínculos útiles