Archivo de la etiqueta: hackers

25 mujeres tecnólogas / hackers / programadoras que sigo en twitter – Parte 1

Hola, en esta ocasión quiero compartir con ustedes una lista de 25 mujeres que sigo (y admiro) en Twitter y que son referencia en el mundo de la tecnología, ya sea por que son programadoras muy hábiles, investigadoras, periodistas especializadas en tecnología, hackers, ingenierías o simplemente tecnologas en general.

#1 – AJ Bowen

AJ Bowen es una ingeniera especializada en infraestructura tecnológica, trabaja en una compañía llamada Travis CI dedicada a implementar soluciones de continues integration, entre las aportaciones de AJ a la comunidad podemos encontrar herramientas como IDNcheck y Clink, también es programadora de Python, Golang, C, C++ y bash scripting.

Bonus: tiene uno de los curriculums mas ingeniosos que he visto (el proyecto es opensource https://github.com/soulshake/cv.soulshake.net/) ya que para visualizarlo necesitas hacer una petición con curl desde la linea de comandos.

$ curl cv.soulshake.net


            ┌───────────────────────────────────────────────────────────────────────────────────────────┐
            │.                                                                                          │
            │                                   Hi, I'm AJ.                                             │
            │                I'm a Python developer with a strong interest in                           │
            │                 APIs, CLIs and subverting the dominant paradigm.                          │
            │                                This is my resume.                                         │
            │                                                                                           │
            │                                                                                           │
            │           Note: this is primarily intended for command-line addicts.                      │
            │             A more conventional version can be found on LinkedIn.                         │
            │                                                                                           │
            │                                                                                           │
            └───────────────────────────────────────────────────────────────────────────────────────────┘

#2 – Aloria

Jefa de seguridad de datos en Flatiron Health, empresa de software dedicada al desarrollo e investigación de nuevos métodos para combatir el cáncer. Aloria es considerada una de las mujeres mas influyentes a nivel mundial en la comunidad de seguridad, también formó parte del equipo de seguridad de Tumblr en donde dedicó gran parte de su tiempo para concientizar a sus seguidores en temas de seguridad informática.

#3 – Azeria

Azeria es una hacker en toda la extensión de la palabra, entre sus aportaciones mas destacadas se encuentran tutoriales completamente gratuitos y de gran calidad sobre ingeniería inversa, ensamblador para plataformas ARM, seguridad ofensiva y otros temas mas avanzados como escalacion de privilegios, binary exploitation y ARM exploit development. Podemos encontrar su material directamente en Azaria Labs.

#4 – Binni Shah

Evangelista de Linux, investigadora de Malware, kernel developer y hasta filántropa, Binni Shah es una verdadera caja de sorpresas, también mantiene Linux – Technology Tidbits, facebook fanpage desde donde comparte artículos muy interesantes sobre seguridad.

#5 – Charity Majors

Tuve la fortuna de conocer a Charity en persona en una de sus platicas sobre ingenieria de sistemas que dio en las oficinas de Microsoft CA en 2016, Charity Majors es una Reliability Engineer eso significa que se encarga de que los sistemas, y la infraestructura en general, siempre este operando de la mejor manera posible, tiene experiencia manejando infraestructura de grandes compañias como Facebook y ahora ha fundado su propia empresa llamada HoneyComb de la cual es la actual CEO

Tip: si lo tuyo es la administración de sistemas (sysadmin) Charity Majors es alguien ha quien debes de seguir en twitter.

#6 – Erika Vilches

Hace unos 6 años cuando comenzaba la universidad tuve la oportunidad de pertenecer a Microsoft Student Partner, en aquel tiempo Erika era una de las personas encargadas de coordinar el programa y gestionar los eventos que nos permitían acercarnos a las tecnologías de Microsoft, así fue como la conocí :). Hoy en día Erika Vilches es una de las mujeres mas influyentes de Latinoamérica en temas de tecnológicos, recomiendo seguirla en twitter para estar enterado de los últimos avances sobre blockchain, chatbots, speech recognition y ciencia/tecnología en general.

#7 – Eva Galperin

Nada mas y nada menos que la directora de ciberseguridad de la Electronic Frontier Foundation, organización sin fines de lucro encargada de luchar por los derechos de las personas en el mundo digital (Internet, ciberespacio, etc.), Eva se enfoca en el sector mas vulnerable (digital-mente hablando) de la población como los periodistas, los medios de comunicación y los ciberactivistas en general, para lograr eso viaja alrededor del mundo concientizando acerca de la privacidad, la libertad de expresión y los peligros del government surveillance.

#8 – Hasherezade

hasherezade es una programadora y analista de Malware que vive en Polonia, ha trabajado como investigadora cientifica, C / C++ developer, penetration tester y actualmente tiene su propia compañia que ofrece servicios de respuesta a incidentes de seguridad, también colabora escribiendo artículos para MalwareBytes.

En su blog personal encontraras algunos de los mejores tutoriales y artículos sobre análisis de Malware que he leído así como soluciones a retos de seguridad, ingeniería inversa y crackmes.

#9 – J.

Es una entusiasta de la seguridad informática, la inteligencia artificial y la automatización, trabaja como analista en el área de DFIR (Digital Forensics and Incident Response) de la empresa Under Armour, compañia estadounidense de ropa y accesorios deportivos. J. es un miembro muy activo de la comunidad de seguridad y participa dando platicas y compartiendo su conocimiento en eventos de seguridad como Defcon.

#10 – Jennifer Sunshine

Jennifer Sunshine es actualmente la CEO de la compañia de ciberseguridad IOActive, ha sido juez de Duo Women in Security los últimos dos añios y ademas también es un miembro muy activo en organizaciones como OWASP, EWF e ISSA.

Hasta aquí la primera parte del articulo, pondré la segunda parte de la lista en la siguiente publicación :), mientras tanto tienen alguna otra recomendación para agregar a mi lista? mujeres que sean un punto de referencia en cuanto a la seguridad informática o el desarrollo de software :D.

Puedes leer la segunda parte de la lista en la siguiente publicación: 25 mujeres tecnólogas / hackers / programadoras que sigo en twitter – Parte 2

Saludos.

Análisis interno y de seguridad de la plataforma #CiudApp

26757261694_a0273fdcb6_z

El 30 de mayo de este año (2016) Enrique Alfaro, presidente de Guadalajara, anunció durante la sesión de Campus Night la nueva aplicación de administración y gestión de información relevante para los ciudadanía: CiudApp.

Entre muchas otras cosas, la aplicación permite a los ciudadanos estar informados de las noticias más relevantes de la administración (por eso del trending de los gobiernos abiertos), realizar reportes incluyendo geolocalización y solicitar o proponer servicios al gobierno.

A raíz del lanzamiento de la aplicación ha surgido bastante debate y comentarios en Internet en torno a la misma, incluso leí un artículo muy interesante en donde le hacían un análisis de usabilidad a la aplicación, pienso que está bien ya que en nuestro querido México, en el pasado hemos tenido casos polémicos como el de la app de los 115 millones de pesos y es natural que la gente que sabe del tema (desarrolladores, ux designers, community managers, etc.) emitan su opinión acerca de un producto tecnológico “generado” por el gobierno.

Regresando a lo anterior, después de leer el análisis heurístico de usabilidad de la aplicación me pregunte a mí mismo ¿Quién está detrás del desarrollo de la aplicación?, ¿Y si le hacemos un análisis interno a la app? Podemos hacer algunas pruebas de seguridad también, vamos a “destripar” la aplicación para entender como está construida y ver cómo fue desarrollada, todo esto con la premisa de que no vamos a romper ni a explotar / vulnerar / hackear nada 🙂 y pues manos a la obra.

Instalando la aplicación en genymotion

Lo primero que vamos a hacer es descargar el apk de la aplicación (Si, el análisis lo vamos a hacer sobre un dispositivo con Android), el link de la app CiudApp en la playstore es https://play.google.com/store/apps/details?id=com.radmas.iyc.guadalajara.mex y hay miles de sitios web que te permiten descargar el apk utilizando la url de la tienda, solo busquen algún en google y descarguen el archivo, cuando hayan terminado tendrán un archivo llamado más o menos así Ciudapp_Guadalajara_v3.0.146_apkpure.com.apk.

Después de eso vamos a instalar la aplicación en genymotion, si no saben lo que es pueden investigar y descargarlo de acá https://www.genymotion.com/ y probablemente escriba un tutorial en el futuro acerca de cómo instalarlo y configurarlo.

android

Ejecutamos nuestro dispositivo virtual de con Android y vamos a proceder a instalar el apk de la aplicacion mediante adb con el comando:

adb install Ciudapp_Guadalajara_v3.0.146_apkpure.com.apk

adb

Una vez termine el proceso de instalación tendremos la app en nuestro dispositivo virtual.

installed

Bueno, ya tenemos la aplicación preparada, vamos a dejar esto por un momento y vamos a regresar a la carpeta en donde descargamos nuestra apk, ahora vamos a utilizar 3 herramientas, apktool, dex2jar y Jd (Jar Decompiler) para entender un poco más como está construida la app.

Obteniendo los assets de la aplicación

Vamos a utilizar apktool para de compilar la app y leer así algunos archivos importantes como el AndroidManifest.xml, strings.xml y cualquier otro archivo que nos pueda decir algo acerca de la app o sus desarrolladores.

apktool.bat d "C:\Users\Alevskey\Documents\Pentest\mobile\ciudapp\Ciudapp Guadalajara_v3.0.146_apkpure.com.apk"

d

apktool_d_folder

Entre los permisos que nos solicita la aplicación tenemos cosas típicas como acceso a la cámara, acceso al GPS, escribir y leer en almacenamiento externo, acceso a internet, etc., permisos que uno esperaría de una aplicación como esta.

<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.radmas.iyc.guadalajara.mex" platformBuildVersionCode="23" platformBuildVersionName="6.0-2166767">
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES"/>
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    <uses-permission android:name="android.permission.CAMERA"/>
    <permission android:name="com.radmas.iyc.guadalajara.mex.permission.MAPS_RECEIVE" android:protectionLevel="signature"/>
    <uses-permission android:name="com.radmas.iyc.guadalajara.mex.permission.MAPS_RECEIVE"/>
    <uses-feature android:glEsVersion="0x20000" android:required="true"/>
    <permission android:name="com.radmas.iyc.guadalajara.mex.permission.C2D_MESSAGE" android:protectionLevel="signature"/>
    <uses-permission android:name="com.radmas.iyc.guadalajara.mex.permission.C2D_MESSAGE"/>
    <uses-permission android:name="com.google.android.c2dm.permission.RECEIVE"/>
    <uses-permission android:name="android.permission.WAKE_LOCK"/>
    <uses-permission android:name="com.radmas.iyc.guadalajara.mex.permission.GPSTRACKER"/> //Show custom dialgo above Statusbar
<uses-permission android:name="android.permission.SYSTEM_OVERLAY_WINDOW"/>

Lo que me llamo la atención desde un inicio, y una de las razones por las que quería hacer este ejercicio, fue encontrar que empresa fue la desarrolladora de la app, revisando más a fondo el archivo vemos que muchos de los packages empiezan con com.radmas.iyc.guadalajara.mex, haciendo una búsqueda en google de radmas.com encontramos lo que parece ser una agencia española (pueden revisar su información en who.is) de desarrollo de software especializada en diseño, marketing, creación de aplicaciones móviles y páginas web.

radmas

Si son desarrolladores de Android pueden identificar rápidamente otras cosas interesantes como los activities de la aplicación, uno que otro broadcast receiver, algunos servicios, intents, public api keys, etc.

También me llamo la atención que la aplicación tiene internacionalización, aunque la app parece un poco genérica, está bien hecha en ese aspecto

idiomas

Con la utilidad File Locator Lite también encontramos algunos archivos interesantes como:

app.json

{
	"server_url":"https://api.mejoratuciudad.org",
	"base_uri":"",
	"jurisdiction_id":"mx.guadalajara",
	"api_key":"12",
	"name":"Ciudapp Guadalajara",
	"promo_text": "Echa un vistazo a 'Ciudapp Guadalajara', la mejor aplicación móvil de atención ciudadana https://play.google.com/store/apps/details?id=com.radmas.iyc.guadalajara.mex",
  	"promo_web": "https://play.google.com/store/apps/details?id=com.radmas.iyc.guadalajara.mex",
  	"email": "[email protected]",
  	"languages":    [{"key":"Español","value":"es"},
	{"key":"Inglés","value":"en"}],
  "share_url": "http://intranet.mejoratuciudad.org/mail/request/"
}

arrays.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="enviroments">
        <item>http://api-canary.mejoratuciudad.org</item>
        <item>http://api-developer.mejoratuciudad.org</item>
        <item>http://api.mejoratuciudad.org</item>
        <item>http://open010.valvaro.lan</item>
        <item>http://open010.vivan.lan</item>
        <item>http://open010.vnacho.lan</item>
        <item>http://open010.vfernando.lan</item>
        <item>http://open010.vwalter.lan</item>
        <item>http://open010.vemilio.lan</item>
    </string-array>
</resources>

De acuerdo a lo que vemos la app se comunica con varios servicios web hospedados en mejoratuciudad.org, investigando un poco sabemos que la empresa anterior mencionada (radmas.com) también es dueña de este producto, y según sus propias palabras:

Mejora Tu Ciudad (MTC) es una plataforma de comunicación entre los ciudadanos y el ayuntamiento, que se enmarca dentro de las soluciones Smart City y que se basa en los tres pilares fundamentales de Open Government:

Participación, colaboración y transparencia

Al menos con esto estoy un poco más tranquilo sabiendo que el gobierno de Guadalajara contrato una empresa especializada para el desarrollo de la aplicación y no a un par de becarios para programar la app XD.

mejoratuciudad

Del DEX al JAR y del JAR al código fuente

Antes de avanzar al siguiente paso hay algo más que podemos hacer, es sabido que los archivos apk, son en realidad archivos rar, entnces tomamos nuestro Ciudapp Guadalajara_v3.0.146_apkpure.com.apk lo renombramos a Ciudapp Guadalajara_v3.0.146_apkpure.com.rar y lo descomprimimos obteniendo algo como lo siguiente:

dex2jar

El contenido de la carpeta es muy parecido a lo que generamos cuando utilizamos apktool sin embargo si tratan de abrir algún archivo xml aquí, como por ejemplo el AndroidManifest.xml lo unico que obtendrán serán 0s y 1s, pero tenemos algo interesante, el archivo classes.dex.

Podemos utilizar dex2jar con el siguiente comando para generar un archivo jar (Javar Archive)

dex2jar.bat "C:\Users\Alevskey\Documents\Pentest\mobile\ciudapp\Ciudapp Guadalajara_v3.0.146_apkpure.com\classes.dex"

Obtendremos un archivo classes_dex2jar.jar que podemos abrir en el Java decompiler, tan solo abrimos la aplicación y seleccionamos el archivo jar.

jd

Muchos de los paquetes que vemos ahí son librerías de terceros y conforme indagamos más y más podemos ver que la aplicación utiliza librerías de facebook, google, librerías para animaciones, reyclerviews personalizados, analytics, Bitly, crash analytics, etc.

jd2

Para agilizar la búsqueda podemos seleccionar File > Save All Sources y elegimos una carpeta en donde guardaremos el archivo Zip generado que después descomprimimos y analizamos, nuevamente utilizando File Locator Lite

app_decompiled

Algunas búsquedas nos arrojan cosas interesantes, como por ejemplo credenciales en texto plano XD

password

passwords2

username

Con las credenciales obtenidas fue posible acceder a lo que parece un portal administrativo de estacionamientos de una tercer empresa llamada urbiotica en http://services.urbiotica.net/

urbiotica

Podemos ver, al parecer, en tiempo real el status de los cajones de un estacionamiento en algún lugar de España, la pregunta aquí es: ¿Que hacían esas credenciales hardcodeadas en la app?, navegando la aplicación no veo por ningún lado algo que haga referencia a estacionamientos sin embargo haciendo otra búsqueda con la palabra park obtenemos referencias en muchos otros archivos.

park

Sin embargo no pude lanzar ningún activity o servicio relacionado al Parking desde adb shell ya que no estaban registradas en el AndroidManifest.xml.

Opino que esas credenciales son quizás de algún desarrollo anterior, el código fuente fue re utilizado y las credenciales fueron olvidadas ahí y ahora están siendo distribuidas masivamente XD, en fin la pantalla administrativa del sistema de estacionamientos luce de esta forma, tiene sentido que haya otra empresa más involucrada en este proyecto, sobre todo si es está enfocada en tecnologías para Smart cities.

park2

Revisando los archivos de la aplicación

Regresamos a nuestro emulador y ahora vamos a abrir una shell de windows y ejecutamos el comando:

adb shell

El comando anterior nos entregara una consola para poder navegar el dispositivo donde instalamos la app, conociendo un poco sobre Internals y arquitectura general de Android sabemos que la información de una app se almacena en la ruta /data/data/package.de.la.app, en este caso /data/data/com.radmas.iyc.guadalajara.mex/

shared_pref

Aquí encontramos otros archivos que podrían contener más cosas interesantes y que a su vez nos podrían enseñar un poco más cómo funciona la aplicación, comenzamos por ver que hay dentro de la carpeta shared_prefs, si no saben lo que es pueden investigar más al respecto acá https://developer.android.com/training/basics/data-storage/shared-preferences.html pero en resumen es un método de almacenamiento persistente que nos ofrece el sistema operativo, la información es almacenada en archivos XML y es generalmente utilizado para guardar configuraciones de la aplicación.

shared_prefs2

Quizás el archivo más interesante es JURISDICTION_LOADED.xml que contiene:

<?xml version='1.0' encoding='utf-8' standalone='yes' ?>
<map>
    <string name="mx.guadalajara">mx.guadalajara</string>
</map>

Y del cual vamos a hablar en la siguiente etapa. Después de que se loguen en la app pueden ver que nuevos archivos de preferencias compartidas son creados, estos contienen información relacionada con su cuenta, facebook, etc, etc.

shared_prefs3

En la carpeta /data/data/com.radmas.iyc.guadalajara.mex/databases/ encontramos dos bases de datos sqlite, procedemos a descargarlas para ver qué es lo que contienen usando los siguientes comandos.

adb pull /data/data/com.radmas.iyc.guadalajara.mex/databases/DBImproveYourCity C:\Users\Alevskey\Documents\Pentest\mobile\ciudapp\databases

adb pull /data/data/com.radmas.iyc.guadalajara.mex/databases/DBImproveYourCity-journal C:\Users\Alevskey\Documents\Pentest\mobile\ciudapp\databases

Y después podemos abrirlas utilizando cualquier visor de sqlite como por ejemplo SQLiteBrowser

db2

En la tabla request es donde podemos ver los reportes “cacheados” por la aplicación en nuestro teléfono, podemos observar el id del reporte (service_request_id), el id de la cuenta de la persona que hizo el reporte (account_id), la calle, coordenadas, url de imagenes, descripcion, status, fecha, etc.

db4

db5

db6

En general cumplen con las buenas prácticas de almacenamiento de información, no almacenan datos sensible en lugares inseguros como la SD externa y en su lugar lo hacen en bases de datos SQLite y shared preferences que es donde solo la aplicación tiene privilegios de lectura y escritura.

Entendiendo las comunicaciones

Ahora viene una de las partes más divertidas de este tipo de ejercicios, saber cómo y con quien se comunica la aplicación, que es lo que envía y que es lo que recibe, etc. Pero antes, si están haciendo este ejercicio mientras leen mi artículo se darán cuenta que la app maneja un concepto muy interesante llamado Jurisdicciones o Jurisdiction, después de analizar el código fuente y visualizar en mi mente el flujo de información, jurisdiction es un identificador que le dice a la app que información cargar de acuerdo a una región especifica, por default la app al iniciar hace un request a https://api.mejoratuciudad.org/applications/12.json y obtiene como resultado

{
  "name": "Guadalajara",
  "active": true,
  "default_jurisdiction_id": "mx.guadalajara"
}

Pueden jugar con el numero al final de la url y de esta manera nos damos cuenta que esta aplicación (o al menos el backend y los servicios web) son escalables y han sido implementados en muchas otras ciudades y países (¿Posiblemente otros clientes de radmas?), por ejemplo https://api.mejoratuciudad.org/applications/5.json nos arroja:

{
  "name": "Cuenta conmigo",
  "active": true,
  "default_jurisdiction_id": "org.sevilla"
}

https://api.mejoratuciudad.org/applications/4.json

{
  "name": "Greencities",
  "active": true,
  "default_jurisdiction_id": "eu.greencities.malaga"
}

Revisando rápidamente con una herramienta para automatizar el proceso podemos ver que actualmente existen 16 jurisdicciones diferentes (al menos en ese servidor), podemos encontrar muchísimas ciudades más del estado de Jalisco así como ciudades de otros países, eso nos dice que la aplicación está siendo implementada en muchos más lugares 🙂

burp

El mismo ID de jurisdicción es utilizado para obtener las noticias, reportes y servicios relacionados de una región en específico.

Continuamos, como sabemos la aplicación se comunica con servicios web hospedados con el proveedor https://api.mejoratuciudad.org/, si vamos a esa URL podremos ver una bonita api REST muy bien documentada 🙂

rest

Esto es muy bueno ya que los desarrolladores ya no estamos limitados a solo utilizar la aplicación, ahora podemos crear nuestras propias aplicaciones utilizando la api ya existente :)! hay otros servicios web muy interesantes como:

Como mencionaba anteriormente, tal solo cambien el valor de la jurisdicción por alguno de los otros y obtendrán la información de las otras plataformas. Para obtener un poco mas de información general de la aplicación, ejecutamos fierce sobre mejoratuciudad.org para tratar de obtener una lista de posibles subdominios

fierce -dns mejoratuciudad.org -wordlist /root/tools/SecLists/Discovery/DNS/subdomains-top1mil-110000.txt -threads 10

fierce

La lista completa:

ftp.mejoratuciudad.org
www.mejoratuciudad.org
intranet.mejoratuciudad.org
api.mejoratuciudad.org
m.mejoratuciudad.org
apps.mejoratuciudad.org
blog.mejoratuciudad.org
demo.mejoratuciudad.org
lab.mejoratuciudad.org
doc.mejoratuciudad.org
developer.mejoratuciudad.org
pandora.mejoratuciudad.org
hera.mejoratuciudad.org
WWW.mejoratuciudad.org
landing.mejoratuciudad.org
privacy.mejoratuciudad.org
electra.mejoratuciudad.org
pi-canary.mejoratuciudad.org
api-developer.mejoratuciudad.org

En este punto el servidor me dio ban (probablemente por mis peticiones automatizadas, pero nada que no se solucione con una VPN), y ya no continué haciendo más pruebas, pero no sin antes darme cuenta de que al parecer su servidor no está hardenizado, cualquier petición a su api devolvía un error 403 revelando la versión del servidor web y su sistema operativo.

<html>
    <head>
        <title>403 Forbidden</title>
    </head>
    <body bgcolor="white">
        <center>
            <h1>403 Forbidden</h1>
        </center>
        <hr>
        <center>nginx/1.4.6 (Ubuntu)</center>
    </body>
</html>

Y si le corremos un scan con nmap a los puertos más conocidos obtenemos.

PORT     STATE SERVICE    VERSION
22/tcp   open  ssh        OpenSSH 6.6.1p1 Ubuntu 2ubuntu2.7 (Ubuntu Linux; protocol 2.0)
80/tcp   open  http       nginx 1.4.6 (Ubuntu)
111/tcp  open  rpcbind    2-4 (RPC #100000)
443/tcp  open  ssl/http   nginx 1.4.6 (Ubuntu)
5666/tcp open  tcpwrapped
Service Info: OS: Linux; CPE: cpe:/o:linux:linux_kernel

Por buenas prácticas de seguridad esa información no debería ser revelada, y es bastante sencillo corregir eso (literalmente es modificar una línea en el archivo de configuración de nginx).

Con la ayuda de Burp Suite es posible analizar los request y eso nos arroja aún más información de cómo se comunica la app, aunque teniendo la documentación de su api a la mano ya no es tan necesario.

Para terminar, que es lo que aprendimos hoy

  • En el desarrollo de este proyecto estuvieron involucradas al menos 3 partes: El gobierno de Guadalajara, la empresa Radmas y Urbiotica (dejando de lado el posible caso de que en realidad ellos no tienen nada que ver y solo las credenciales de uno de sus clientes fueron leakeadas en la app, eso sería muy mala suerte)
  • Al menos la app de Android (que fue la que analice) fue desarrollada de forma nativa
  • Hacen buen uso de las funcionalidades para almacenar información, guardan la información sensible utilizando shared preference y bases de datos sqlite
  • El almacenamiento de imágenes lo hacen en la nube de aws
  • La app tiene credenciales hardcodeadas (posiblemente de un proyecto anterior del cual re utilizaron el código) y que al día de hoy funcionan
  • La app utiliza el servicio de mejoratuciudad.org que al parecer es un producto de radmas.com y podemos decir que es un software / plataforma / tecnologia especializada para hacer implementaciones en smart cities
  • Los servidores de mejoratuciudad.org no están hardenizados
  • Los servidores de mejoratuciudad.org cuentan con algún tipo de IDS/IPS que bloquea a usuarios después de X número de peticiones automatizadas.
  • La plataforma no implementa esos controles puesto que solo utilice una VPN para cambiar mi IP y ya pude seguir interactuando con la app sin problemas.
  • Debido al concepto de Jurisdicciones sabemos que la app está siendo implementada en muchas otras ciudades de México y el mundo (16 clientes para ser exactos según los servidores de mejoratuciudad.org)
  • Los servicios web no parecen vulnerables a algún tipo de ataque popular como SQL injection, xss, RCE, etc. Muy bien por Radmas 🙂 )
  • El código fuente de la aplicacion no fue ofuscado

Happy hacking … salu2

Platica: Contraseñas seguras

password-security

Esta charla se titula Contraseñas seguras Tips y tecnologías que te ayudaran a mantener seguras tus cuentas en Internet y la impartí en mayo para la comunidad Morelia Code en el polifórum digital de Morelia.

En esta ocasión hablamos acerca del uso de las contraseñas en nuestra vida cotidiana, mostramos algunas técnicas actuales utilizadas por los atacantes para hacerse con las mismas y damos consejos sobre como crear contraseñas seguras, también mostramos ejemplos de software manejador de contraseñas para minimizar el riesgo de que nuestros passwords sean robados por usuarios maliciosos.

Mi experiencia durante MoreliaHacks 2015

Hola de nuevo lectores 🙂 como les comentaba en una publicación anterior, en noviembre estuve participando en el I/O Hack 2015 con un proyecto de agricultura y drones, me divertí bastante y aprendí muchas cosas nuevas, después de todo fue mi primer hackaton. Asistí al evento por varias razones, la primera es porque me gustan los retos, solucionar problemas de la vida real y creo que eventos de este tipo son los ideales, la segunda razon, y de lo que se trata este post, es que a mediados de octubre de este año me junte con un grupo de personas en Morelia para discutir una estrategia en la que pudieramos impulsar proyectos de datos y gobierno abierto en la ciudad, estuvimos investigando bastante, viendo que es lo que se hacía en otros lugares y al final decidimos que lo más adecuado era organizar un hackaton, debido a eso me fui al I/O Hack para aprender lo más que pudiera en cuanto a temas de logística, organización, programación del evento y todo eso 🙂

Planeando el evento

Como decía, todo comenzó con una plática en starbucks, juntas y más juntas donde definíamos una planeación, nuestro objetivo era impulsar el gobierno abierto en la ciudad y para hacerlo antes teníamos que demostrar el poder de las fuentes públicas de información (las redes sociales), en pocas palabras diseñamos un plan en donde pudiéramos obtener suficiente información para responder a preguntas como ¿Qué es lo que se está diciendo de Morelia?, ¿Cuáles son los principales problemas de la ciudad?, etc. todo por medio de la opinión publica de los ciudadanos.

Organizando el evento

Conforme el los días pasaban la fecha del evento se acercaba, y teníamos que tener listo cada detalle del evento, ahora, yo como mentor tecnológico me encargaba de las cosas técnicas: sitio web, registro de participantes, envió de correos y todas esas cuestiones, pero después entendí que un evento de esta magnitud requiere mucho más que eso, se tienen que conseguir todos los patrocinadores, la difusión del evento, protocolos (no protocolos de red xd sino mas bien sociales) de inauguración, comida, ruedas de prensa y muchísimas cosas más en donde no soy experto pero que gracias a que estaba involucrado en la organización pude ver muy de cerca, además los otros miembros organizadores sabían hacer bastante bien su trabajo 🙂

Bonus: durante este proceso tuve la oportunidad de dar varias entrevistas y aparecer en televisión XD.

12303938_10206490936287026_6276593269870553135_o

hack

Se realizó la convocatoria y de todos los aspirantes se eligió a los 40 mejores programadores, me di a la tarea de evaluar sus aptitudes no solo revisando su cv, investigue si habían hecho alguna aportación a proyectos de software libre, si tenían cosas interesantes en github, si pertenecían a alguna comunidad en línea, algún blog personal y cosas de ese estilo, yo estaba buscando ese espíritu hacker y no tanto expertis en un tema específico, me interesaban personas que si tenían un problema iban a buscar la manera de solucionarlo a como dé lugar, gente que estuviera dispuesta a aprender nuevas cosas y a enseñar lo que saben y me dio mucho gusto encontrar a varias personas con esas cualidades.

Primer día del evento

Llego el gran día, viernes 11 de diciembre, se presentó oficialmente el proyecto a la comunidad tecnológica, a los medios y al gobierno de la ciudad, se realizó otra pequeña rueda de prensa y se contestaron varias dudas de los participantes, durante la organización conocí a dos personas increíbles especializadas en manejo de datos abiertos de una empresa llamada Fractal, ellos dieron una plática en donde explicaban todo acerca del gobierno abierto.

12347767_448143095393425_6599439726446076015_n

Al final del primer día cerramos con una sesión de neworking en donde todos los participantes y los mentores interactuaron, aprovechamos para presentarnos, conocernos, hablar acerca de que es lo que hacía cada quien y prepararnos para el día siguiente.

Segundo día del evento

Durante el segundo día yo hable un poco acerca de tecnologías que nos podían ayudar a recopilar información de fuentes públicas, apis de redes sociales (facebook, twitter, youtube, etc) y algunas herramientas que ya existen en el mercado como socialsensor, después organizamos a los participantes mediante grupos que se encargarían de hacer distintas tareas como:

  • Extracción de datos de redes sociales
  • Visualización de datos
  • Crawling de sitios web
  • Datos abiertos
  • Procesamiento de lenguaje natural
  • Prevención del crimen
  • Movilidad

Y así comenzó el hackaton, durante 8 hrs seguidas los programadores trabajaron arduamente para lograr los objetivos asignados, fueron 8 hrs en donde estuve conociendo más de cerca a los participantes, resolviendo sus dudas y también aprendiendo acerca de las tecnologías que estaban usando y su experiencia con ellas 🙂

12359902_10206558445974726_8280400728719171982_n

12341556_448442548696813_6272023644551489969_n

12376532_448442682030133_4535409909592327811_n

Al final del evento cada equipo presento los avances que habían logrado, las herramientas que crearon y las soluciones que planearon, el equipo de visualización se encargó de crear un pequeño sitio web en donde se centralizaron todas las apis desarrolladas durante el evento http://api.moreliahacks.org/, muchas de estas apis continúan siendo desarrolladas por sus creadores.

Comentarios personales

Para concluir la publicación me gustaría terminar con algunos comentarios personales, ser parte de la organización de este evento sin duda me dejo bastantes cosas, yo por lo general siempre me he encargado del aspecto técnico de las cosas, tech guy, la persona que está detrás de la creación de plataformas y aplicaciones, siempre estuve cómodo y conforme con eso, sin embargo cuando te empiezas a involucrar en otros aspectos fuera de tu área, cosas tan básicas como ver qué tipo de comida tendrán los participantes, el color de las playeras que recibirán, la decoración del evento y después tener la oportunidad de tomar el micrófono para expresar tus ideas y tus pensamientos a las personas, eso es algo que de alguna forma te cambia y te hace crecer como persona, pienso yo.

Contribuir con la creación de una comunidad de hackers cívicos en mi ciudad y la organización del primer hackaton de la ciudad es una experiencia que nunca antes había tenido, como mencionaba al inicio de mi post ya había tenido la oportunidad de participar en un hackaton y esta vez me toco estar del otro lado, ser el mentor :).

Como en todos los eventos, y más por ser el primero, hay muchísimas oportunidades de mejora, personas con las que te encontraras que no comparten tus mismas opiniones e ideales pero con las que al final debes lidiar y convencer del por qué haces las cosas que haces, de lo que si estoy seguro es que la colaboración entre las personas es el futuro y al final es algo que nos beneficia a todos como sociedad.

Saludos.

Tutorial Material Design en Android #4

Crear un Navigation Drawer para Android

Después de una pequeña pausa retomamos la serie de tutoriales de Material Design en Android, en el tutorial anterior aprendimos como agregar iconos (actions) a nuestra Toolbar, así que lo que sigue ahora es aprender cómo implementar el Navigation Drawer.

El Navigation Drawer en Android es un panel que podemos utilizar en nuestra app y que por lo general contiene un menú para movernos o “navegar” por las distintas secciones en la aplicación, la principal ventaja es que puede permanecer oculta la mayor parte del tiempo y desplegarse solo cuando el usuario lo necesite, de esa manera “economizamos” el espacio en la pantalla del teléfono, como en los tutoriales anteriores, si quieren aprender un poco más sobre la teoría siempre pueden consultar la documentación oficial de google Navigation Drawer

patterns_navdrawer_settings1

También vale la pena mencionar que hay básicamente 3 estilos de Navigation Drawer:

  • Navigation Drawer por debajo de la Toolbar oscurenciendola
  • Navigation Drawer por debajo de la Toolbar sin oscurecerla
  • Navigation Drawer por encima de la Toolbar

El estilo que queramos lograr dependerá de cómo escribamos el xml en nuestras views, y un poco de Java también

playstore_styledrawer_bellowdrawer_over_toolbar

Pues manos a la obra, o mejor dicho al código, vamos a nuestro archivo activity_main.xml y deberíamos de tener algo así.

activity_main

Vamos a modificar un poco nuestro código xml y agregaremos un par de elementos llamados DrawerLayout, FrameLayout y NavigationDrawer, viendo la siguiente imagen quedara más claro lo que vamos a hacer en nuestra activity.

drawer_layout_demon

Vamos a crear un elemento android.support.v4.widget.DrawerLayout y vamos a meter todo nuestro código existente dentro de esa etiqueta.

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="com.alevsk.materialdesignapp.MainActivity">

        <include
            android:id="@+id/app_bar"
            layout="@layout/app_bar" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/app_bar"
            android:text="@string/hello_world" />

    </RelativeLayout>
</android.support.v4.widget.DrawerLayout>

Lo siguiente es crear un Fragment y lo que hago normalmente para tener mi código más organizado es crear un nuevo Package en el proyecto llamado fragments y ahí empiezo a crearlos, para eso en su com.alevsk.materialdesignapp > botón secundario > new > Package y le ponen el nombre que deseen, yo le puse fragments para que sea descriptivo, después de eso procedemos a crear la nueva clase como se muestra en la siguiente imagen.

fragments

Nos aparecerá el siguiente cuadro de dialogo donde tendremos que elegir el nombre del nuevo menú NavigationDrawer (fragmento), le ponemos NavigationDrawerFragment o como ustedes quieran pero que sea descriptivo hacia el hecho de que será el menú de nuestra aplicación, asegúrense de marcar la opción de crear el layout xml y podemos desmarcar las dos opciones de abajo, el código que nos genere Android studio será más limpio y nosotros implementaremos los métodos que necesitamos desde 0, para terminar damos clic en el botón de Finish.

navigationdrawerfragment

Android Studio nos habrá generado dos archivos, NavigationDrawerFragment.java y fragment_navigation_drawer.xml

1

2

En nuestro fragment_navigation_drawer.xml vamos a modificar el elemento principal de Fragment a RelativeLayout quedando el código de la siguiente manera

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.alevsk.materialdesignapp.fragments.NavigationDrawerFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="@string/hello_blank_fragment" />

</RelativeLayout>

Hicimos este cambio ya que más adelante necesitaremos agregar elementos extras como un RecyclerView, a continuación vamos al archivo activity_main.xml y vamos a agregar nuestro NavigationDrawer usando un elemento fragment de la siguiente forma.

    <fragment
        android:id="@+id/fragment_navigation_drawer"
        android:name="com.alevsk.materialdesignapp.fragments.NavigationDrawerFragment"
        android:layout_width="280dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:layout="@layout/fragment_navigation_drawer"
        tools:layout="@layout/fragment_navigation_drawer" />

El codigo final del activity_main.xml es el siguiente:
3

Lo que sigue es crear un objeto NavigationDrawer en nuestro MainActivity.java

NavigationDrawerFragment drawerFragment = (NavigationDrawerFragment) getSupportFragmentManager().findFragmentById(R.id.fragment_navigation_drawer);

Si por alguna razón les da un error de compatibilidad asegúrense que en NavigationDrawerFragment.java en la sección de import (hasta arriba) el Fragment que esté utilizando sea android.support.v4.app.Fragment

Ya que estamos en este archivo vamos a crear de una vez un método llamado setUp que va a servir para inicializar los componentes de nuestro NavigationDrawer, también vamos a utilizar un nuevo objeto llamado ActionBarDrawerToogle cuya finalidad es la de manejar nuestro DrawerLayout y Toolbar de una manera más eficiente, así como encargarse de manejar el evento de abrir y cerrar el panel de navegación.

    public void setUp(DrawerLayout drawerLayout, Toolbar toolbar) {
        mDrawerLayout = drawerLayout;
        mToolbar = toolbar;
        mDrawerToggle = new ActionBarDrawerToggle(getActivity(),drawerLayout,toolbar, R.string.open, R.string.close) {
            @Override
            public void onDrawerClosed(View drawerView) {
                super.onDrawerClosed(drawerView);
            }

            @Override
            public void onDrawerOpened(View drawerView) {
                super.onDrawerOpened(drawerView);
            }
        };
        mDrawerLayout.setDrawerListener(mDrawerToggle);
    }

Tip: R.string.open y R.string.close son necesarios para el constructor del ActionBarDrawerToggle ya que son los textos que aparecen al abrir y cerrar el panel, pueden definir esas cadenas en su archivo strings.xml que se encuentra en res/values

<string name="open">Abierto</string>
<string name="close">cerrado</string>

De nuevo, aquí mucho cuidado, asegúrense de que el Toolbar que estén importando sea android.support.v7.widget.Toolbar para efectos de compatibilidad, ya que si utilizan la clase por defecto les va a dar errores en los demás archivos.

Lo que acabamos de hacer en nuestro código es definir un nuevo ActionBarDrawerToggle, vinculamos el DrawerLayout y Toolbar que estamos recibiendo desde nuestro MainActivity y preparamos el listener (manejador de eventos) para cuando el usuario abra y cierre el panel de navegación.

En el MainActivity.java después de instanciar nuestro NavigationDrawer mandamos llamar el método

public class MainActivity extends ActionBarActivity {

    private Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        toolbar = (Toolbar) findViewById(R.id.app_bar);
        setSupportActionBar(toolbar);

        NavigationDrawerFragment drawerFragment = (NavigationDrawerFragment) getSupportFragmentManager().findFragmentById(R.id.fragment_navigation_drawer);
        drawerFragment.setUp((DrawerLayout)findViewById(R.id.drawer_layout),toolbar);
    }

La clase NavigationDrawerFragment quedo de la siguiente manera
NavigationDrawerFragment

En este punto, si corremos nuestra aplicación y deslizamos haciendo tap desde la izquierda podemos observar como la pantalla comienza a oscurecerse, si ponemos un poco más de atención podemos ver el texto de nuestro fragment encima de la app”Hello Blank Fragment“, ha funcionado! ahora solo nos queda poner un poco de estilo para hacer a aplicación más agradable a la vista.

navigation_drawer_feo

En nuestro archivo colors.xml (se encuentra en app/res/values/colors.xml) podemos definir nuevos colores, por ejemplo yo he definido uno nuevo llamado graypanel

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="primaryColor">#E91E63</color>
    <color name="primaryColorDark">#C2185B</color>
    <color name="textColorPrimary">#FFFFFF</color>
    <color name="grayPanel">#EEEEEE</color>
    <color name="lightGray">#d6d6d6</color>
    <color name="colorAccent">#8BC34A</color>
</resources>

Y despues en nuestro fragment_navigation_drawer.xml definimos el color de fondo a nuestro RelativeLayout con android:background=”@color/grayPanel”

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/grayPanel"
    tools:context="com.alevsk.materialdesignapp.fragments.NavigationDrawerFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="@string/hello_blank_fragment" />

</RelativeLayout>

navigation_drawer_color

¿Un poco mejor cierto? pero todavía le falta bastante, por ejemplo no resulta obvio para el usuario saber que la aplicación tiene un menú lateral, lo que vamos a hacer es agregar el clásico icono de menú de lado izquierdo, para eso utilizaremos un método llamado syncState de nuestro objeto DrawerToggle.

Nos vamos a nuestro archivo NavigationDrawerFragment.java y agregamos el siguiente código después de haber hecho el mDrawerLayout.setDrawerListener(mDrawerToggle);

        mDrawerLayout.post(new Runnable() {
            @Override
            public void run() {
                mDrawerToggle.syncState();
            }
        });

Corremos la app de nuevo y automáticamente nos aparecerá un icono de menú.

menu_icon

Una vez abierto el menú de navegación rara notaran que si hacemos tap donde se supone que esta el botón de menú el panel se cierra, es bastante raro pues la aplicación no está respetando las “capas”, podemos corregir ese comportamiento bajando un poco el NavigationDrawer.

Modificamos un poco nuestro archivo main_activity.xml, si se fijan bien ahora nuestro DrawerLayout esta debajo de nuestra app_bar, ambos elementos estan al mismo nivel y rodeados por un LinearLayout con orientación vertical.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:background="@color/lightGray"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <include
        android:id="@+id/app_bar"
        layout="@layout/app_bar" />

    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <TextView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:text="@string/hello_blank_fragment" />
        </RelativeLayout>

        <fragment
            android:id="@+id/fragment_navigation_drawer"
            android:name="com.alevsk.materialdesignapp.fragments.NavigationDrawerFragment"
            android:layout_width="280dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:layout="@layout/fragment_navigation_drawer"
            tools:layout="@layout/fragment_navigation_drawer" />
    </android.support.v4.widget.DrawerLayout>
</LinearLayout>

drawer_navigation

Y eso es todo por ahora, así es como se programa un NavigationDrawer desde 0 :), en el siguiente tutorial implementaremos las opciones en nuestro menú de navegación, para eso aprenderemos a utilizar los RecyclerViews.

He montado un repositorio en Github con el código de la aplicación que vamos desarrollando durante los tutoriales, si tienen alguna duda pueden consultarlo directamente de ahí o preguntarme en los comentarios https://github.com/Alevsk/Material-design-en-Android

salu2