es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Ionic Capacitor (Angular) página en blanco en ios al construir desde XCode.

30 Jul, 2023 Programación

Estoy construyendo una aplicación con Ionic 6 + capacitor. Funciona bien cuando la pruebo en el navegador y en la compilación para Android. Sin embargo, cuando intento compilarla usando XCode simplemente no funciona: solo se muestra una página en blanco.

Si ejecuto el comando ionic capacitor run ios -l --external desde Webstorm, se inicia el emulador de iPhone y todo funciona bien. Si abro el proyecto con XCode y hago clic en el botón de reproducción, muestra el emulador con una página en blanco.

Mi archivo capacitor.config es:

{
    "appId": "com.ionic.app",
    "appName": "ionic-app",
    "webDir": "www",
    "bundledWebRuntime": false,
}

La consola de XCode al iniciar la aplicación es:

2021-12-30 17:09:09.817042+0100 App[22182:360758] KeyboardPlugin: resize mode - native
⚡️  Cargando la aplicación en capacitor://localhost...
⚡️  [log] - Angular se está ejecutando en modo de desarrollo. Llame a enableProdMode() para habilitar el modo de producción.
⚡️  WebView cargado
⚡️  To Native ->  App addListener 101717497

Observa que localhost no muestra el puerto 8100 habitual.

El problema es que cuando ejecuto la aplicación a través de XCode, el servidor de Angular no se inicia, por lo tanto, la aplicación solo muestra una página en blanco. Si inicio el servidor a través de ng run app:serve --host=0.0.0.0 --port=8100 y agrego la siguiente configuración a capacitor.config en XCode:

"server": {
    "url": "http://localhost:8100"
}

Entonces todo vuelve a funcionar correctamente.

¿Hay algún comando o alguna configuración de capacitor que deba incluir para iniciar el servidor de Angular cuando la aplicación se inicia? ¿O no es necesario iniciarlo y el problema puede estar en otro lugar?

Gracias de antemano.

ACTUALIZACIÓN:
El problema parece estar en el guardia de autenticación. Aún tengo que descubrir qué es exactamente lo que causa el problema, pero sin el guardia la aplicación funciona bien.

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Solución para la aplicación Ionic 6 + Capacitor que no funciona en XCode

    Si estás construyendo una aplicación Ionic 6 + Capacitor y funcionando correctamente en el navegador y en la compilación de Android, pero solo muestra una página en blanco en XCode, esto puede ser debido a que el servidor Angular no se está iniciando. Cuando ejecutas la aplicación a través de XCode, el servidor Angular no se inicia, por lo tanto, la aplicación solo muestra una página en blanco.

    Para resolver este problema, puedes iniciar el servidor manualmente a través de ng run app:serve --host=0.0.0.0 --port=8100 y agregar la siguiente configuración al archivo capacitor.config en XCode:

    "server": {
        "url": "http://localhost:8100"
    }

    Esto debería solucionar el problema y hacer que la aplicación funcione correctamente en XCode.

    Sin embargo, si la aplicación todavía no funciona, el problema podría estar en otro lugar. Como se mencionó en la actualización, podría estar relacionado con el guardia de autenticación. En ese caso, debes averiguar exactamente qué está causando el problema y solucionarlo en consecuencia.

Comments are closed.