Contamos con la solución a este disgusto, al menos eso pensamos. Si presentas alguna pregunta coméntalo, que sin dudarlo te ayudaremos
Solución:
La aplicación PWA muestra la barra de direcciones cuando intenta navegar por las páginas fuera de scope
. Por ejemplo, si ha configurado su alcance en el archivo manifest.json como scope: "/my-pwa/"
entonces toda la URL de la página debería tener prefix Me gusta esto: /my-pwa/page.html
.
En Android, debe implementar un TWA (actividades web confiables) para habilitar el modo de pantalla completa. Así que te recomiendo que uses el PWABuilder para hacer eso. El PWABuilder ya le devuelve un archivo APK asignado y un assetlink.json que deberá cargar en su servidor en un .well-known
carpeta en la raíz de su host: https://www.your-domain/.well-known/assetlink.json
> De esa manera, Android muestra su PWA en modo de pantalla completa.
TL; DR: vea el último párrafo para la solución que finalmente lo resolvió para mí.
He tenido la barra de navegación en un PWA, aunque probé todo, así que pensé en compartir todo lo que hice, lo que funcionó y cómo lo resolví finalmente, para que no tengas que buscar soluciones en línea durante horas como tuve que
Ampliando la respuesta de @alvaropaco, en el archivo .zip que obtiene de PWABuilder, usted deber colocar el assetlink.json
archivo en una carpeta llamada .well-known
, directamente bajo su dominio. Debe estar accesible en https://www.your-domain.com/.well-known/assetlink.json, o la barra de navegación no se ocultará. Sin excepciones. Lea el README.html que vino con su .apk:
Próximos pasos para obtener su PWA en Google Play Store Ha generado correctamente un paquete de aplicación de Google Play Store (
.apk
expediente)para su PWA.
Tus próximos pasos:
- Desplegar
assetlinks.json
a su servidor.- Pruebe su paquete en un dispositivo Android o en un emulador de Android.
- Sube tu
apk
archivo a Google Play Store.Cada paso se explica a continuación.
1. Implementar
assetlinks.json
Su archivo zip contiene
assetlinks.json
. Este es un archivo de enlaces de activos digitales que demuestra que posee el dominio de su PWA. Sube este archivo a tu servidor enhttps://example.com/.well-known/assetlinks.json
. (Reemplace example.com con la URL de su PWA).♂️ Aviso:
Se requieren enlaces de activos digitales para que su PWA se cargue sin la barra de direcciones del navegador. Si ve una barra de direcciones del navegador en su aplicación en Android, su
assetlinks.json
el archivo falta, es inaccesible o es incorrecto. Consulte nuestro asistente de enlaces de activos para solucionar este problema.
Si usted es no construir tu aplicación con PWABuilder; tal vez usando bubblewrap en su lugar, o algo más, aquí hay algunas fuentes para ayudarlo a comenzar a crear un archivo assetlinks.json:
- Guía de inicio rápido de actividades web confiables
- Eliminación de la barra de direcciones del navegador
Nota al margen:
Al compilar mi aplicación con bubblewrap, seguía recibiendo este molesto error que no me permitía continuar porque había un problema al instalar las herramientas del SDK de Android:
C:UsersMeDesktopapp>bubblewrap build
,-----. ,--. ,--. ,--.
| |) /_,--.,--| |-.| |-.| |,---.,--. ,--,--.--.,--,--.,---.
| .-. | || | .-. | .-. | | .-. | |.'.| | .--' ,-. | .-. |
| '--' ' '' | `-' | `-' | --| .'. | | '-' | '-' '
`------' `----' `---' `---'`--'`----'--' '--`--' `--`--| |-'
`--'
Installing Android Build Tools. Please, read and accept the license agreement
build Installing Build Tools
Error: Could not find or load main class com.android.sdklib.tool.sdkmanager.SdkManagerCli
cli ERROR undefined
Publiqué una respuesta de desbordamiento de pila separada relacionada con este problema.
Verificar assetlinks.json
Para verificar que assetlinks.json se reconozca correctamente en un dispositivo Android, ejecute estos pasos: (primero debe instalar adb y grep):
Depuración de enlaces de activos digitales
Después de generar su APK firmado. se puede instalar en un dispositivo de prueba, usando adb:
adb install app-release.apk
Si el paso de verificación falla (si la barra de direcciones aún está visible), es posible verificar si hay mensajes de error utilizando Android Debug Bridge, desde la terminal de su sistema operativo y con el dispositivo de prueba conectado.
adb logcat | grep -e OriginVerifier -e digital_asset_links
Ahora, asegúrese de que su aplicación esté completamente cerrada (fuerce su detención) y vuelva a abrirla.
Si está fallando verás Statement failure matching fingerprint. Verification failed.
mensaje. Por lo tanto es importante para revisiónAndroidManifest.xml y construir.gradle archivos y verifique si las configuraciones coinciden con los enlaces de activos.json.
De lo contrario Verification succeeded.
debe aparecer el mensaje.
fuente
¿Qué pasa si assetlinks.json es verificado pero la barra de navegación aún persiste?
Estaba teniendo este problema, pero finalmente lo resolví con la ayuda de esta publicación de problemas de GitHub. Resultó que tenía la host
parámetro en twa-manifest.json
(no manifest.json
porque lo construí con bubblewrap – tiene más flexibilidad que PWABuilder, aunque solo funciona para Android) configurado en https://example.com
en vez de https://www.example.com
(nota la www
) donde está mi sitio Realmente alojado Entonces, si lo construye con PWABuilder, primero vaya a su sitio en el navegador, haga clic en la barra de direcciones, copie el URL completay pegar ese en PWABuilder.
La barra de direcciones debería desaparecer.