Registro de controladores de protocolo de URL para AWPs

Permite que las AWP instaladas controlen los vínculos que usan un protocolo específico para lograr una experiencia más integrada.

Thomas Steiner

Antecedentes de los esquemas (o protocolos)

Un identificador uniforme de recursos (URI) es una secuencia compacta de caracteres que identifica un recurso abstracto o físico. Cada URI comienza con un nombre de esquema que hace referencia a una especificación para asignar identificadores dentro de ese esquema. Por lo tanto, la sintaxis del URI es un sistema de nomenclatura federado y extensible en el que la especificación de cada esquema puede restringir aún más la sintaxis y la semántica de los identificadores que usan ese esquema. Los esquemas también se conocen como protocolos. A continuación, puedes ver algunos ejemplos de esquemas.

tel:+1-816-555-1212
mailto:Jane.Doe@example.com
news:comp.infosystems.www.servers.unix
https://web.dev/

El término localizador uniforme de recursos (URL) hace referencia al subconjunto de URI que, además de identificar un recurso, proporciona un medio para ubicar el recurso mediante la descripción del mecanismo de acceso principal (p.ej., la ubicación de la red).

Antecedentes del método registerProtocolHandler()

El método registerProtocolHandler() de Navigator solo para contenido seguro permite que los sitios registren su capacidad para abrir o controlar esquemas de URL específicos. Por lo tanto, los sitios deben llamar al método de la siguiente manera: navigator.registerProtocolHandler(scheme, url). Los dos parámetros se definen de la siguiente manera:

  • scheme: Es una cadena que contiene el protocolo que el sitio desea controlar.
  • url: Es una cadena que contiene la URL del controlador. Esta URL debe incluir %s, como marcador de posición que se reemplazará por la URL con escape que se controlará.

El esquema debe ser uno de los esquemas de la lista segura (por ejemplo, mailto, bitcoin o magnet) o comenzar con web+, seguido de al menos una o más letras minúsculas de ASCII después del prefijo web+, por ejemplo, web+coffee.

Para dejar esto más claro, aquí hay un ejemplo concreto del flujo:

  1. El usuario visita un sitio en https://coffeeshop.example.com/ que realiza la siguiente llamada: navigator.registerProtocolHandler('web+coffee', 'coffee?type=%s').
  2. Más adelante, mientras visita https://randomsite.example.com/, el usuario hace clic en un vínculo, como <a href="web+coffee:latte-macchiato">All about latte macchiato</a>.
  3. Esto hace que el navegador navegue a la siguiente URL: https://coffeeshop.example.com/coffee?type=web%2Bcoffee%3A%2F%2Flatte-macchiato. La cadena de búsqueda decodificada como URL y, luego, lee ?type=web+coffee://latte-macchiato.

De qué se trata el manejo de protocolos

El mecanismo actual de registro de controladores de protocolo de URL para AWP consiste en ofrecer el registro de controladores de protocolos como parte de una instalación de AWP a través de su manifiesto. Después de registrar una AWP como controlador de protocolo, cuando un usuario haga clic en un hipervínculo con un esquema específico, como mailto, bitcoin o web+music desde un navegador o una app específica de la plataforma, la AWP registrada abrirá y recibirá la URL. Es importante tener en cuenta que tanto el registro propuesto basado en manifiestos como el registerProtocolHandler() tradicional desempeñan roles muy similares en la práctica y, a la vez, permiten la posibilidad de experiencias del usuario complementarias:

  • Las similitudes incluyen los requisitos en torno a la lista de esquemas que se pueden registrar, el nombre y el formato de los parámetros, etcétera.
  • Las diferencias en el registro basado en manifiestos son sutiles, pero pueden ser útiles para mejorar la experiencia de los usuarios de AWP. Por ejemplo, es posible que el registro de la AWP basada en manifiestos no requiera una acción adicional del usuario además de la instalación de la AWP iniciada por el usuario.

Casos de uso

  • En una AWP de procesamiento de texto, el usuario que está en un documento encuentra un vínculo a una presentación, como web+presentations://deck2378465. Cuando el usuario hace clic en el vínculo, la AWP de presentación se abre automáticamente en el alcance correcto y muestra la presentación de diapositivas.
  • En una app de chat específica de la plataforma, el usuario en un mensaje de chat recibe un vínculo a una URL magnet. Cuando hagas clic en el vínculo, se iniciará una AWP instalada de torrent y comenzará a descargarse.
  • El usuario tiene instalada una AWP de transmisión de música. Cuando un amigo comparta un vínculo a una canción como web+music://songid=1234&time=0:13 y el usuario haga clic en ella, la AWP de transmisión de música se iniciará automáticamente en una ventana independiente.

Cómo usar el registro del controlador de protocolo de URL para AWP

La API para el registro del controlador de protocolo de URL se basa estrechamente en navigator.registerProtocolHandler(). Solo esta vez, la información se pasa de forma declarativa a través del manifiesto de la aplicación web en una propiedad nueva llamada "protocol_handlers" que toma un array de objetos con las dos claves requeridas "protocol" y "url". En el siguiente fragmento de código, se muestra cómo registrar web+tea y web+coffee. Los valores son cadenas que contienen la URL del controlador con el marcador de posición %s requerido para la URL con escape.

{
  "protocol_handlers": [
    {
      "protocol": "web+tea",
      "url": "/tea?type=%s"
    },
    {
      "protocol": "web+coffee",
      "url": "/coffee?type=%s"
    }
  ]
}

Varias apps que se registran para el mismo protocolo

Si varias aplicaciones se registran como controladores para el mismo esquema (por ejemplo, el protocolo mailto), el sistema operativo le mostrará al usuario un selector y le permitirá decidir cuál de los controladores registrados usar.

La misma app se registra para múltiples protocolos

La misma app puede registrarse para varios protocolos, como puedes ver en el ejemplo de código anterior.

Actualizaciones de apps y registro de controladores

Los registros del controlador se sincronizan con la última versión del manifiesto que proporciona la app. Hay dos casos:

  • Una actualización que agrega controladores nuevos activa el registro de controladores (independientemente de la instalación de la app).
  • Las actualizaciones que quitan los controladores activan la anulación del registro de estos (independientemente de la desinstalación de la app).

Depuración del controlador de protocolo en Herramientas para desarrolladores

Ve a la sección Controladores de protocolo desde el panel Application > Manifest. Puedes ver y probar todos los protocolos disponibles aquí.

Por ejemplo, instala esta AWP de demostración. En la sección Controladores de protocolo, escribe "americano" y haz clic en Probar protocolo para abrir la página del café en la AWP.

Controladores de protocolo en el panel Manifest

Demostración

Puedes ver una demostración del registro de controladores de protocolos de URL para AWP en Glitch.

  1. Ve a https://protocol-handler.glitch.me/, instala la AWP y vuelve a cargar la app después de la instalación. El navegador registró la AWP como controlador para el protocolo web+coffee con el sistema operativo.
  2. En la ventana de la AWP instalada, haz clic en el vínculo https://protocol-handler-link.glitch.me/. Se abrirá una pestaña nueva del navegador con tres vínculos. Haz clic en el primero o en el segundo (latte macchiato o americano). Ahora, el navegador te mostrará un mensaje y te preguntará si estás de acuerdo con que la app sea un controlador de protocolo para el protocolo web+coffee. Si aceptas, la AWP se abrirá y mostrará el café seleccionado.
  3. Para comparar con el flujo tradicional que usa navigator.registerProtocolHandler(), haz clic en el botón Registrar controlador de protocolo en la AWP. Luego, en la pestaña del navegador, haz clic en el tercer vínculo (chai). También mostrará un mensaje, pero luego abrirá la AWP en una pestaña, no en una ventana del navegador.
  4. Envíate un mensaje a través de una aplicación específica de la plataforma, como Skype en Windows, con un vínculo como <a href="web+coffee://americano">Americano</a> y haz clic en él. Del mismo modo, debería abrir la AWP instalada.

Demostración del controlador de protocolos de URL con una pestaña del navegador con vínculos a la izquierda y una ventana de AWP independiente a la derecha.

Consideraciones de seguridad

Dado que la instalación de la AWP requiere que el contexto sea seguro, el control de protocolos hereda esta restricción. La lista de controladores de protocolo registrados no se expone a la Web de ninguna manera, por lo que no se puede usar como un vector de creación de huellas digitales.

Intentos de navegación no iniciados por el usuario

Es posible que los intentos de navegación que el usuario no inicie, pero que sean programáticos, no abran apps. La URL del protocolo personalizado solo se puede usar en contextos de navegación de nivel superior, pero no, por ejemplo, como la URL de un iframe.

Lista de protocolos permitidos

Al igual que con registerProtocolHandler(), existe una lista de protocolos permitidos de protocolos para que las apps se registren.

Cuando se inicie la AWP por primera vez debido a un protocolo invocado, se mostrará un diálogo de permiso al usuario. En este diálogo, se mostrará el nombre y el origen de la app, y se le preguntará al usuario si esta puede controlar vínculos del protocolo. Si un usuario rechaza el diálogo de permiso, el sistema operativo ignorará el controlador de protocolo registrado. Para cancelar el registro del controlador de protocolo, el usuario debe desinstalar la AWP que lo registró. El navegador también cancelará el registro del controlador de protocolo si el usuario selecciona "Recordar mi elección" y selecciona "No permitir".

Comentarios

El equipo de Chromium quiere conocer tu experiencia con el registro de controladores de protocolos de URL para AWP.

Cuéntanos sobre el diseño de la API

¿Hay algo acerca de 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 especificaciones en el repositorio de GitHub correspondiente o agrega tus ideas a un problema existente.

Informar un problema con la implementación

¿Encontraste un error en 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 puedas, además de instrucciones simples para reproducir el contenido, y, luego, ingresa UI>Browser>WebAppInstalls en el cuadro Componentes. Glitch funciona muy bien para compartir repros rápidos y fáciles.

Muestra compatibilidad con la API

¿Planeas usar el registro del controlador de protocolo de URL para las AWP? Tu asistencia pública ayuda al equipo de Chromium a priorizar funciones y les muestra a otros proveedores de navegadores la importancia de admitirlas.

Comparte cómo planeas usarlo en la conversación del discurso de WICG. Envía un tweet a @ChromiumDev con el hashtag #ProtocolHandler y cuéntanos dónde y cómo lo usas.

Agradecimientos

El registro del controlador de protocolo de URL para AWP se implementó y especificó con Fabio Rocha, Diego González, Connor Moody y Samuel Tang del equipo de Microsoft Edge. Joe Medley y Fabio Rocha revisaron este artículo. Hero image de JJ Ying en Unsplash.