Cree e implemente aplicaciones de Chrome Kiosk

Este artículo está dirigido a los administradores y desarrolladores de Chrome con experiencia en el desarrollo de aplicaciones de Chrome.

Como administrador de Chrome, puede convertir los dispositivos con ChromeOS en dispositivos de un solo propósito, como una señalización digital o una pantalla interactiva. También puede implementar aplicaciones de kiosco listas para usar desde Chrome Web Store o crear su propia aplicación de kiosco.

En Chrome 57 y versiones posteriores, algunos dispositivos con ChromeOS admiten apps para Android. A fin de obtener información sobre cómo instalar aplicaciones para Android en dispositivos Chrome administrados, consulte Utilizar aplicaciones Android en dispositivos Chrome que funcionan en modo kiosco.

Consideraciones

• Para poder implementar aplicaciones de kiosco en dispositivos con ChromeOS, debe inscribir los dispositivos. Para obtener más información, consulte Registrar dispositivos ChromeOS.
• Puede usar aplicaciones empaquetadas de Chrome para compilar aplicaciones de kiosco. Sin embargo, no puede usar aplicaciones alojadas.
• Use apps de Chrome que estén configuradas para ejecutarse en pantalla completa.
• Siga las prácticas recomendadas para el desarrollo de apps de Chrome.

Paso 1: Compile una aplicación de Chrome Kiosk

Como desarrollador, hay 2 maneras de compilar una aplicación de kiosco que puede implementar en dispositivos Chrome. Use una aplicación web existente y Chrome App Builder para empaquetarla como una aplicación de kiosco o cree una nueva aplicación web.

Opción 1: Use una app web existente

Antes de comenzar: En la computadora donde compilará aplicación de kiosco, agregue Chrome App Builder al navegador Chrome.

1. En la computadora en la que compilará la aplicación, cree una carpeta para los archivos de la aplicación.
2. Abra Chrome App Builder.
3. Ingrese el nombre de la app y la versión inicial.
   Defina la versión inicial en un número bajo, como 0.0.0.1, a fin de tener espacio para aumentar el número de versiones nuevas.
4. Ingrese la URL de la página principal actual de la aplicación.
   La URL será la página de destino de la nueva aplicación de kiosco.
5. Elija los controles de navegación, como retroceder, avanzar, volver a cargar y reiniciar la sesión.
6. Especifique los valores de tiempo de espera:
   • Tiempo de espera de inactividad de la sesión: Es el tiempo de inactividad de la aplicación antes de que se borren los datos de navegación.
   • Tiempo de espera para volver a la página principal: Es el tiempo de inactividad la app antes de volver a la página principal. Los datos de navegación no se borran.
     El tiempo de espera predeterminado de la sesión inactiva y el tiempo de espera para volver a la página principal es de cero minutos; la aplicación no agota el tiempo de espera.
7. (Opcional) A fin de especificar las Condiciones del Servicio para los usuarios de la aplicación, ingrese el texto.
8. (Opcional) A fin de rotar la página principal para que se ajuste al dispositivo donde se ejecutará, seleccione un valor.
   Por ejemplo, rote una app 90 grados para ejecutarla en un dispositivo que tiene un diseño vertical.
9. Seleccione Kiosk mode enabled.
10. Haga clic en Export kiosk app.
11. Elija dónde deseas exportar los archivos de la aplicación y haga clic en Select.

Después de crear una aplicación de kiosco con Chrome App Builder, puede agregar más archivos para personalizarla.

Opción 2: Compile una app nueva

Use los archivos de muestra de los siguientes pasos para compilar una aplicación de kiosco sencilla.

1. En la computadora en la que compilará la aplicación, cree una carpeta para los archivos de la aplicación. 
2. Cree el archivo HTML de la app.
   1. Cree un archivo HTML con un editor de texto.
      Aquí tiene un sample HTML file.
   2. En la carpeta de la aplicación, guarde el archivo como application.html.
3. Cree el manifiesto.
   1. Con un editor de texto, cree un archivo de notación de objetos (JSON) de JavaScript. Aquí tiene un sample JSON file.
   2. Asegúrese de que kiosk_enabled esté configurado como verdadero, "kiosk_enabled": true.
   3. (Opcional) Para evitar que una aplicación se ejecute como una aplicación normal, configure kiosk_only como verdadero ("kiosk_only": true).
   4. (Opcional) Para acelerar el tiempo que tardan las páginas web en cargarse inicialmente en el control de WebView de la aplicación de kiosco, especifique partition="persist:" en la etiqueta de WebView.
      Si desea obtener más detalles, consulte la información del desarrollador para el atributo de partición.
   5. Asegúrate de que el código JSON tenga el formato correcto con la herramienta de validación de JSON de terceros que elijas.
   6. En la carpeta de la aplicación, guarde el archivo como manifest.json.
4. Especifique la altura y el ancho de la aplicación.
   1. Cree un archivo CSS con un editor de texto. Aquí tiene un sample CSS file.
   2. En la carpeta de la aplicación, guarde el archivo como application.css.
      Nota: Las apps de kiosco se expanden automáticamente al modo de pantalla completa.
5. (Opcional) Para permitir que los usuarios finalicen la sesión de kiosco, haga lo siguiente:
   1. Cree un archivo JavaScript con un editor de texto. Aquí tiene un sample JS file.
   2. En la carpeta de la aplicación, guarde el archivo como application.js.
6. Cree la secuencia de comandos en segundo plano:
   1. Cree un archivo JavaScript con un editor de texto. Aquí tiene un sample JS file.
   2. En la carpeta de la app, guarde el archivo como background.js.
7. Cree los íconos de la app y guárdelos en la carpeta correspondiente:
   1. Cree un ícono de 128 x 128 p y guárdelo como 128.png.
   2. Cree un ícono de 96x 96 p y guárdelo como 96.png.

También puede usar este sample zip file que contiene archivos de aplicación para una aplicación de prueba con controles de navegación y un botón de restablecimiento. Se entregará una versión publicada de la aplicación, Aplicación de kiosco del navegador Chrome 1.0, en Chrome Web Store. Puede editar los archivos con cualquier editor de texto.

Paso 2: Pruebe la app de kiosco

Como desarrollador, asegúrese de que la aplicación de kiosco funcione en un dispositivo con Chrome OS.

1. En un dispositivo Chrome, acceda a su cuenta de Google.
2. Guarde la carpeta de la app en su dispositivo de prueba.
3. Vaya a chrome://extensions/.
4. En la parte superior derecha, active el modo de desarrollador.
5. Haga clic en Cargar extensión sin empaquetar.
6. Busque y seleccione la carpeta de la aplicación.
7. Abra una nueva pestaña en el navegador Chrome y haga clic en Aplicaciones  de la aplicación. Asegúrese de que se cargue y funcione correctamente.
8. Si es necesario, realice cambios en el archivo manifest.json, aloje la carpeta de la aplicación y vuelva a probarla. Repita el procedimiento hasta que la app funcione correctamente.

Paso 3: Publique en Chrome Web Store

Como programador, puede elegir que las aplicaciones y las extensiones estén disponibles para todos o controlar quién puede instalarlas. Hay dos maneras de publicar aplicaciones de kiosco en Chrome Web Store:

• Pública: Todos pueden ver e instalar la aplicación.
• No listada: Solo los usuarios con el vínculo de la aplicación pueden verla e instalarla. La aplicación no aparece en los resultados de la búsqueda de Chrome Web Store. Puede compartir el vínculo de la aplicación con usuarios fuera de su dominio.

Siga estos pasos para agregar una aplicación de kiosco en Chrome Web Store:

1. Comprima la carpeta que contiene sus archivos.
2. Siga los pasos que se indican en Publicar en Chrome Web Store. 

Paso 4: Implemente la aplicación de kiosco

Como administrador, puede agregar la aplicación de kiosco en la Consola del administrador de Google.

1. Accede a la Consola del administrador de Google.

   Accede con tu cuenta de administrador (no termina en @gmail.com).

2. In the Admin console, go to Menu  DevicesChromeApps & extensionsKiosks.
3. To apply the setting to all users, leave the top organizational unit selected. Otherwise, select a child organizational unit.
4. Coloca el cursor sobre Agregar y haz clic en Agregar desde Chrome Web Store.
5. Busque la aplicación que desea implementar y haga clic en Seleccionar.
6. Si se te solicita, acepta los permisos de la app en nombre de tu organización.
7. En el panel de la derecha, establezca las políticas de la aplicación y de las extensiones. Obtenga información sobre cada parámetro de configuración.
8. Haz clic en Guardar.

Temas relacionados

• Aplicaciones de kiosco
• Cree su primera app
• Configuración del kiosco
• Gestionar la configuración de las aplicaciones de kiosco de Chrome
• Programar y mostrar contenido con Chrome Sign Builder

Google y las marcas y los logotipos relacionados son marcas de Google LLC. Todos los otros nombres de productos y empresas son marcas de las empresas con las que estén asociados.