Chrome, proxys y formularios inseguros

El título de esta entrada se parece «curiosamente» al título de una película de miedo… Y al principio eso es lo que es, ya que desde el lunes estoy recibiendo esta pantalla en mi chrome cada vez que meto una incidencia en mi redmine:

El caso es que luego le dabas al botón de enviarlo de todas formas y la cosa funcionaba normalmente… Eso si, era sumamente molesto y tenía clientes que accedían a poner sus incidencias y no era plan tener que explicarles a todos que no es que ahora fuésemos menos seguros que antes, sino que chrome había activado una funcionalidad nueva.

Esa funcionalidad, que estaba prevista para chrome 86, pero que se activó con chrome 87 hace que cuando los datos de un formulario se envíen a una página que no tiene https activado se de la advertencia de que cualquiera podría interceptar los datos… Me parece muy buena advertencia, pero ¡Espera! todo el tráfico de mis webs ya va por https, ¿cómo es que recibo esa advertencia?

Según la especificación de chrome esto solo debía pasar si el formulario llevaba a una página no segura, así que revisé las etiquetas form y vi que eran rutas relativas (y si es relativa dentro de una página https debería llevar a una página https), así que decidí revisar el camino completo usando el inspector de chrome donde, efectivamente, vi que la petición se realizaba a una página https pero descubrí que el campo Location que aparecía en los headers de la petición venía como http y no https, ¿cómo podía ser?

Pues resulta, después de mucho buscar, que la gestión del https la estaba haciendo mediante un proxy inverso en apache y, parece ser, que la directiva ProxyPassReverse modifica el host del Location, pero no el protocolo. Por suerte esto tiene fácil solución y basta con incluir esto en el VirtualHost:

RequestHeader set X-Forwarded-Proto "https"

Antes de hacerlo no os olvidéis de añadir el módulo:

sudo a2enmod headers

Con esto ya conseguiremos que el proxy no confunda a chrome y que desaparezca el molesto mensaje…

Exportar passwords en chrome y firefox

Ahora que ya tenemos la conciencia de que guardar los passwords en nuestros navegadores es algo sumamente inseguro y que solo debemos hacer en contadas ocasiones y en ordenadores que jamás nunca dejemos a nadie, es posible que nos interese ver la manera de recuperar todos esos passwords que hemos dejado olvidados en nuestros navegadores y así poder borrarlos con seguridad. Es un procedimiento sumamente sencillo, pero el resultado es un archivo donde se pueden ver en claro todas las claves que has usado, así que es mejor que lo destruyas cuanto antes.

Vamos al lío:

Sacar las claves de Chrome

  1. Ejecuta chrome y en la barra de direcciones escribe chrome://flags o about://flags dependiendo de la versión (la que te funcione).
  2. Busca en la ventana que te aparece (ctrl+f) «importar y exportar contraseñas» y cambia su estado a «Habilitada»
  3. Reinicia el navegador
  4. Navega a la configuración (menú configuración) y dentro de esta página pincha en «Mostrar configuración avanzada«, baja un poco y pincha en «Administrar contraseñas«.
  5. Aparecerán dos botones que antes no estaba ahí «Importar» y «Exportar«
  6. Pincha «Exportar» para descargarte todas tus claves. Dependiendo del sistema operativo es posible que te pida autorización (entrar la cuenta de windows, por ejemplo).
  7. Se mostrará un selector de archivos, elige el directorio y el nombre que deseas darle al archivo. Se generará un archivo texto en formato csv con los siguientes campos:
    • Nombre: nombre del wesite
    • URL: dirección del website donde se introdujo la contraseña
    • Usuario: nombre de usuario
    • Password: password del usuario
  8. El botón «Importar» hace lo contrario, así que puedes pasar contraseñas de otro sitio a chrome usando este método.

Sacar las claves de Firefox

Para extraer las claves de firefox utilizaremos una extensión, que podemos encontrar aquí: Password Exporter. Una vez instalado seguiremos estos pasos:

  1. Ve a Preferencias->Seguridad, verás que aparece una nueva opción Importar/Exportar contraseñas
  2. Pincha en el botón, te aparecerá la pantalla para que selecciones si quieres encriptar o no las claves (si las encriptas solo podrás importarlas en otro firefox)
  3. Después de un par de pantallas de advertencia se nos pedirá que seleccionemos un archivo. Para maximizar compatibilidad yo suelo usar el formato csv que finalmente se grabará con los siguientes datos:
    • Hostname: nombre del wesite
    • Username: nombre de usuario
    • Password: password del usuario
    • formSubmitURL: dirección del website donde se introdujo la contraseña
    • httpRealm: en autenticación basica de http pone el nombre del dominio.
    • usernameField: nombre del campo donde se pone el usuario
    • passwordField: nombre del campo donde se pone el password
  4. Para importar habría que hacer el camino inverso

Por desgracia los formatos no son intercambiables, por lo que tendrás que modificarlos a mano si quieres pasar passwords de firefox a chrome o viceversa.

¡Advertencia! : una vez usados estos archivos para lo que queramos es muy recomendable destruirlos, ya que así evitamos problemas de filtraciones.

Creando extensiones para los navegadores

Como ya os he comentado, desarrollando mi nuevo proyecto NoMorePass, uno de los elementos fundamentales para que se usase la app era disponer de un plugin para el navegador que permitiese interceptar las páginas con usuario/password y entrar en las mismas con el protocolo seguro de NoMorePass. Aunque en principio solo quería hacer uno para demostrar lo que se podía hacer (el de chrome, por obvias razones), al final terminé desarrollando cinco para cubrir la mayoría de las necesidades. No voy a entrar en detalles ahora sobre la tecnología subyacente, lo que voy a hacer es contaros las principales diferencias entre cada uno de los ecosistemas para los que hice las extensiones y los problemas que nos vamos a encontrar.

Todas las extensiones que he programado han funcionado (que no es poco) y todas están en javascript, así que esa parte me la voy a saltar y voy a contaros los problemas que me encontré en orden cronológico.

Chrome

Aunque, a priori, creí que iba a ser el más complicado, porque partía de una base muy pobre en lo que a extensiones se refiere, al final no fue para tanto. La documentación que dispone en la web de developers de chrome es muy completa y con ejemplos que sirven para casi todo.

Probar la extensión es sencillo, solo hay que activar el modo desarrollador en la pestaña de extensiones y cargar el directorio en el que estamos trabajando… La depuración y lo demás es muy sencillo si estamos acostumbrados a inspeccionar o depurar páginas web.

La parte más «complicada» es cuando quieres distribuir la extensión. Hay una opción que te permite empaquetarla en un archivo .crx, peeeeeero, eso no sirve para nada ya que al abrir el crx con chrome te dice que no va a instalarte nada… Así que tienes que decirles a tus probadores que se descompriman el archivo y activen la parte de desarrollador (que es un rollo de explicar) o bien pasarlo al chrome web store… Es lo que hice y puedes dejar la extensión sin publicar para que lo usen tus probadores. Muy fácil y rápido. Eso si, te pueden banear la extensión (a mi me pasó) si la revisan y ven algo sospechoso. Lo bueno es que puedes explicar lo que pasa y como funciona y si todo está ok son muy rápidos en volverte a activar la extensión. Muy contento con esta parte.

Firefox

El segundo en preferencia es, como no, Firefox. Había oído que los .xpi ya estabán obsoletos y que ahora había que hacer extensiones más parecidas a las de chrome… Y tanto! El estandar webextension está bien documentado en la MDN y, el problema, es que no es un estándar maduro del todo. Está muy basado en las extensiones chrome a las que «copian» casi todo, por lo que es muy sencillo pasar de una a otra, pero con carencias importantes (que en mi caso me hicieron reescribir gran parte de la extensión). Lo prometedor del tema es que están avanzando y según los navegadores vayan incorporando las funcionalidades que faltan vamos a un escenario de muy, muy facil adaptación.

Mozilla te ofrece la función en el AMO (addons.mozilla.org) de subir tu extensión y que te la firmen para que la puedas dstribuir entre tus probadores sin que se queje mucho el navegador. Obviamente también puedes subirla a la página pública, pero ahí el tema varía mucho…. Subí una primera versión no del todo pulida y a los dos días me rechazaron la extensión y me dieron consejos para resubirla. Lo hice a los 30 minutos de recibir la respuesta pero, según lo que dicen, me metieron en la cola de revisión de los administradores y esa cola es EXAGERADAMENTE lenta. Hoy llevo ya 32 días esperando en esa cola y estoy todavía en el número 126:

A este paso a finales de mes igual tengo ya la extensión en la página de addons de Mozilla… Completamente desesperante.

Safari

A petición de mis amigos mac-queros estudié la posibilidad de realizar una extensión para Safari. Dejadme que os diga una cosa, es un puto infierno. Apple ha cambiado la forma de construir una extensión para que tengas que escribir parte del código en Xcode (Objective-c o swift) y otra parte en javascript y que tengas que utilizar un sistema infame de empaquetado para subirlo al itunes y que aparezca disponible. El caso es que lo hice, siguiendo todas sus intrucciones, y después de conseguir que funcionase en mi mac me encontré con la maraña de certificados, firmas, perfiles, etc. que me obligaron a cambiar el proyecto un poco… Con tan mala suerte que una vez subido a itunes resulta que no funcionaba ¡¡!!

Así que, recuperé la forma antigua de hacer las extensiones, puramente en javascript y con un esquema muy parecido a las de chrome y las webextensions y un empaquetado mucho más sencillo… Y generé un archivo que Safari puede instalar sin problemas y que puedo distribuir sin problemas… Una pena que Apple se empeñe con todo su alma en hacer las cosas difíciles a los desarrolladores.

Opera

Ya con todos los deberes hechos me pareció interesante ver el nivel de compatibilidad de las webextensions entre navegadores… Y decidí hacer la extensión para Opera. Mi sorpresa fue mayúscula cuando vi que la misma extensión de chrome funcionaba sin apenas cambios en opera (quité un par de cosas del manifest.json y poco más). Así que, ole por Opera! El proceso de publicación, no obstante, sigue siendo bajo revisión y tienes que subirlo (con mucha más info de la que deseaba) en https://addons.opera.com/developer/ y ahí sigue esperando revisión… El problema es que no se en qué puesto de la cola estoy ni cuanto tiempo va a tardar en llegar a estar disponible.

Edge

Y llegamos a la gran esperanza «windowsera», visto que, según la documentación, edge permitía un esquema muy parecido a las webextensions de firefox me lancé al ruedo y, con una máquina virtual de windows10 profesional, empecé a adaptar la extensión de firefox.

La definición correcta para las extensiones de Edge es: ¡niseteocurraporDios! Después de un montón de horas lidiando con actualizaciones del sistema, con cuelgues, con malos funcionamientos del sistema de depuración y con mi bisoñez en el sistema conseguí que la extensión funcionase en desarrollo en mi máquina… Bueno, ahora distribuirlo…

Pues no es tan sencillo, ni mucho menos, después de gastarme 90 euros (75+iva) en darme de alta como desarrollador de microsoft para reservarme el nombre de la aplicación y poder subirla a la tienda de windows.. Resulta que la tienda no admite extensiones. ¡¡¡¡¡!!!!! y, lo que es peor, para distribuir el appx que consigo generar tengo que firmarlo con unos certificados que no tengo y que solo se pueden generar con extraños comandos que no te explican de donde salen (si al menos te dijeran como hacerlo con openssl) y luego el usuario tiene que instalarse el certificado en su máquina antes de instalar la extensión.. En suma, no se cómo distribuir esta extensión ni si merece la pena….

Según microsoft esto es lo que pasa:

Así que hay que pedir por favor, por favor, que te tengan en cuenta en esta url: http://aka.ms/extension-request

Y esperando estoy…