Aprende a evitar que aparezca el error net::ERR_CLEARTEXT_NOT_PERMITTED en tu aplicación Cordova.

Cómo resolver Cordova en el error del plugin InAppBrowser: net::ERR_CLEARTEXT_NOT_PERMITTED

Después de 2 años de trabajar con diferentes tecnologías, comencé a usar Cordova una vez más para un pequeño proyecto en paralelo. Como es habitual con todo con lo que trabajo, al intentar algo bastante sencillo, aparecen errores de cualquier tipo, esta vez el error parecía estar relacionado con la configuración de la red.

Causa de este problema

Este problema siempre se activará en su proyecto si no ha habilitado el soporte de texto sin cifrar en su aplicación. En mi caso con Cordova In App Browser, el siguiente código activa la excepción:

let ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');

El sitio web de Apache funciona normalmente en mi navegador, entonces, ¿cuál es el problema real? En este caso, cuando activa una solicitud a http://apache.org , el servidor realizará una redirección porque falta la conexión https, así como la www que se fuerza cuando crea la solicitud. Su aplicación bloquea la primera redirección, ya que se ha realizado a través de HTTP (inseguro). Si activas la solicitud usando https, entonces funciona perfectamente:

let ref = cordova.InAppBrowser.open('https://apache.org', '_blank', 'location=yes');

Ésa es la razón de este problema. El tráfico de texto plano es básicamente texto que no ha sido sometido a encriptación y no está destinado a ser encriptado.

Posible solución # 1

La solución más obvia es simplemente agregar el protocolo correcto al sitio web que estás intentando abrir (HTTPS) siempre que el servidor desde el que se solicita la información admita dicho protocolo.

Posible solución # 2

La primera solución no es tan útil cuando trabaja con sitios web que no ofrecen una conexión segura o con archivos locales.

Como se mencionó, el soporte de tráfico de texto sin formato está deshabilitado de manera predeterminada a partir de Android 9 (nivel de API 28), por lo que puede habilitarlo si lo necesita. Simplemente agrega el siguiente atributo al nodo de la aplicación en tu archivo AndroidManifest.xml:

android:usesCleartextTraffic="true"

Tu archivo se verá así:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.yourcompany.packagename">

    <application
        ...
        android:usesCleartextTraffic="true"
        ...
        >

Esto permitirá el tráfico de texto claro desde cualquier fuente que, dependiendo de tus necesidades, puede ser la mejor solución. Intenta compilar tu aplicación e inicia el navegador en la aplicación con la URL que estaba lanzando la excepción y debería funcionar ahora.

Posible solución # 3

Alternativamente, si necesitas permitir el tráfico de texto sin cifrar solo de ciertas fuentes, puedes especificarlo usando el archivo de configuración de seguridad de red de tu aplicación de Android ( res/xml/network_security_config.xml):

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config>
        <domain 
            includeSubdomains="true"
            cleartextTrafficPermitted="true"
        >example.com</domain>
    </domain-config>

    <base-config cleartextTrafficPermitted="false"/>
</network-security-config>

Cambia el dominio example.com por el que necesitas y asegúrate de usar el archivo de configuración mencionado en tu archivo AndroidManifest.xml de esta manera:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.yourcompany.packagename">

    <application
        android:networkSecurityConfig="@xml/network_security_config"
        >

Que te diviertas❤️!


Ingeniero de Software Senior en EPAM Anywhere. Interesado en la programación desde los 14 años, Carlos es un programador autodidacta, fundador y autor de la mayoría de los artículos de Our Code World.

Conviertete en un programador más sociable

Patrocinadores