Personalizar el panel lateral de Opera

  7/29/2010    

operapanelwidgets

Opera desde hace mucho tiempo que ofrece un panel lateral que se muestra al presionar la tecla F4 o habilitar Opera Unite. Este panel contiene botones que nos dan acceso a nuestros marcadores, widgets, Unite, descargas, historial, notas, además de ello ofrece la posibilidad de personalizarlo, y así es como podemos agregarle sitios web que soporten dispositivos móviles con la finalidad de aprovechar el espacio reducido que ocuparemos.

En el anterior post, les mencioné sobre un nuevo navegador, Epic, que incluye esta característica, ofreciéndonos botones para acceder a nuestros sitios sociales como Twitter y Facebook.

En este tutorial verán cómo agregar tales sitios web en su versión móvil en el panel lateral de Opera.

Primero activamos el panel con (F4)

operapanel

Hacemos clic en el botón +

operapanel2

Elegimos Personalizar…

operapanel3

Presionamos en Añadir panel Web…

operapanel4

Enseguida añadimos el Nombre que se mostrará, la carpeta de nuestros bookmarks en dónde guardar, y lo más importante la dirección que ha de ser la página web destinada para dispositivos móviles del sitio web que deseemos utilizar, aunque pueden utilizar cualquier página, pero el diseño de sitios web para móviles resulta muy conveniente por su tamaño.

Hacemos clic en Aceptar dos veces y ya tendremos el siguiente resultado:

operapanel5

Eso es todo, ahí les va una lista de direcciones que les podría interesar.

   / / / /

Epic 1.0 beta, un nuevo navegador desde la India

  7/29/2010    

epicbrowser

Desde Bangalore, India, Hidden Reflex, una desarrolladora independiente nos trae un navegador web basado en Mozilla Firefox para Windows llamada Epic. Este navegador está totalmente enfocado en tres áreas.

  1. Multitarea
  2. Personalización con plugins
  3. Y fusión de contenido web móvil con contenido web convencional

Epic es casi tan igual como otros navegadores web existentes, tiene manejos de pestañas, entre otras, pero lo que lo diferencia es la presencia de botones en el lado izquierdo, cuya funcionalidad es ofrecer aplicaciones web, addons, juegos entre muchas otras cosas, aunque no tan diferente, ya que Opera ofrece algo parecido (Opera Unite : F4)

Lo interesante es que viene con un motor integrado de antivirus y antispyware de ESET aunque es necesario que se descarguen definiciones de virus antes de utilizarlo, pero eso también lo hace el mismo addon. La ventaja que ofrece es que los usuarios pueden realizar un análisis del sistema o carpetas en la barra lateral sin abandonar el navegador. También tiene un gadget llamado “write” que abre un editor de texto dentro de un pestaña. Además ofrece un botón para “Mi PC” que permite explorar nuestras carpetas en la barra lateral.

Otra característica de Epic es la integración con Facebook, Twitter, Gmail, Google Maps, Yahoo y Orkut. Al presionar uno de estos gadgets nos mostrará la web de dicho servicio pero en su versión para móviles dentro de la barra lateral. No es nada nuevo este concepto ya que en Opera se puede agregar cualquier página en el panel lateral.

También es posible realizar búsquedas de vídeos en Youtube en ese panel, y hasta poder verlo sin duda una alternativa interesante puesto que tal vez deseemos ver algún vídeo mientras hacemos algo.

En mi opinión personal, Epic es un nuevo navegador que ha tomado una característica de Opera que tal vez muchos no conocemos, sin embargo ofrece herramientas muy interesantes que quizás Opera no tiene, me refiero al Antivirus y al explorador de archivos integrada.

EPIC Browser <~ disponible.

via Betanews

PD: En el siguiente artículo les mostraré como agregar Twitter, Facebook entre otros, en el panel lateral de Opera.

   / / /

Entornos de Desarrollo Online

  7/28/2010    

Vemos que existen herramientas online para escribir documentos tales como LiveDocs y Google Docs, al igual que esos también existen entornos de desarrollo integrado online (IDE : Integrated Development Environment) que nos permiten mantener nuestro código fuente utilizando herramientas web integradas que nos facilitará realizar nuestro trabajo desde cualquier lugar.

De los muchísimos que podamos encontrar estas son algunas alternativas web más resaltantes.

NOTA: Al utilizar estos servicios debemos tener en cuenta que si deseamos darle acceso a nuestro hosting mediante FTP usándolos como intermediario, es recomendable crear cuentas limitadas o temporales ya que no sabemos si estos servicios almacenan nuestra información de manera segura.

Algunos Editores utilizados por algunas IDE

 

Bespin

Mozilla labs ofrece Bespin, un editor de código fuente que está basado en los últimos estándares web y requiere de un navegador moderno que soporte HTML5 específicamente el elemente CANVAS con la habilidad de escribir texto.

Dependiendo de lo que se quiera lograr y cuánto tiempo se desea invertir, hay muchas maneras de cómo puede utilizarse Bespin: Se puede utilizar directamente, o descargarlo para incluirlo en nuestras propias aplicaciones e inclusive poder crear nuestro propio servidor Bespin.

Bespin | Demo

yMacs

Es un editor web de código fuente, parecido a Emacs, permite resaltar sintaxis, mostrar numeración de las líneas entre otras cosas.

yMacs | Demo

CodeMirror

Es una biblioteca Javascript que puede ser utilizado para crear un editor de código, tiene una gran variedad de lenguajes que soporta: Javascript, XML/HTML, CSS, SparQL, HTML modo mixto, HTML+PHP, Python, Lua, Ruby, SQL, PLSQL, diff, Groovy, C#, OmetaJS

CodeMirror | Demo

 

IDE : Entornos de Desarrollo Integrado

 

CodeRun

CodeRun es un IDE que es gratuito y open source, que incluye soporte nativo para C#/.NET (3.5), PHP (5.1), JavaScript, HTML y CSS e inclusive plantillas para poder realizar todo tipo de aplicaciones web, tal es el caso de poder crear extensiones para Google Chrome. C# soporta ASP.NET, WCF, Silverlight y aplicaciones web WPF. Soporta base de datos SQL Server 2005 y Amazon SimpleDB.

Además de ello incluye resaltador de sintaxis y auto-completado de código para hacernos más fácil el desarrollo de aplicaciones web. También tiene un depurador online que permite establecer puntos de interrupción, paso a paso, inspección a llamadas entre otras acciones de depurado.

Web de CodeRun – Demostración

coderun

 

Kodingen

Si no pueden probar la demostración de Bespin la pueden hacer en Kodingen. Kodingen es un CDE (Cloud Development Environment), un entorno de desarrollo que contiene además de ese editor de código fuente a otros editor web para ofrecer un entorno mucho más rico (CodeMirror, Ymacs, Pixlr, Aviary…) ofreciendo la posibilidad de editar inclusive imágenes gracias a Aviary. Aún se encuentra en estado Beta, requiere de estar registrado para poder acceder a varias características, tales como crear documentos, acceso FTP, entro otros.

  • Almacenamiento en la nube
  • Subdomino con nuestro nombre de usuario para probar rápidamente nuestro código.
  • Editores de código (Bespin, Codemirror, Ymacs)
  • Múltiples documentos al mismo tiempo
  • Almacenamiento gratuito
  • etc…

kodingend1

Kodingen

 

PHPAnywhere

Es un completo entorno de desarrollo online exclusivo para el lenguaje PHP, ofrece todas las herramientas que un desarrollador necesita para escribir sus aplicaciones web en PHP.

  • Resaltado de sintaxis
  • Completado de código
  • Explorador FTP
  • Historial (Deshacer/Rehacer)
  • Un entorno de desarrollo familiar
  • Recuerda el estado en que dejaste tu sesión (proyectos)
  • Alineado del código de manera inteligente (soporta también la tecla TAB)
  • Plegado de funciones
  • Soporta i18n (internacionalización)
  • Pestañas para múltiples documentos al mismo tiempo
  • Buscar y reemplazar
  • entro otros…

Requiere de una cuenta.

phpanywhere

phpAnywhere

 

 

Amy Editor

Este es muy conocido y además ofrece una amplia variedad de lenguajes para su resaltado de sintáxis, abre multiples archivos utilizando pestañas para acceder a cada una de ellas, y por si fuera poco ofrece un depurador integrado. Lo más resaltante es la posibilidad de administrar varios proyectos al mismo tiempo pudiendo acceder remotamente a nuestro servidor FTP.

amy.com

Amy Editor

 

eCoder

Es un sencillo editor web que incluye un explorador de archivos, permite subir archivos, también ofrece abrir múltiples documentos para poder ser editados al mismo tiempo. eCoder es un editor web de código fuente y además es open source, requiere de  navegadores modernos, soporta atajos de teclado.

ecoder

eCoder

 

Codeita

Codeita es un IDE robusto, fácil de usar, basado en la nube. Es un editor de código fuente que ofrece un editor avanzado de gráficos SVG, gestor de proyectos colaborativos. Permite a los usuarios mantener su código fuente disponible desde cualquier ubicación sin los inconvenientes de realizar sincronizaciones, copias de respaldo. Ofrece un entorno de desarrollo basado en LAMP (Linux+Apache+MySQL+PHP) actualmente está en versión beta pública.

  • Editor de código con resaltador de sintáxis
  • Editor de imágenes SVG que puede exportar a PNG
  • Administrador de tareas específicas a los proyectos
  • Almacenamiento flexible en la nube (100MB)
  • Capacidad de publicarlo mediante FTP

codeitaweb

Codeita

 

ShiftEdit

Actualmente está bajo desarrollo pero funcional, incluye muchas de las características que se espera de un IDE incluyendo acceso FTP, pestañas, edición de documentos HTML, JS, CSS, PHP. Requiere registrarse.

shifteditdemo

ShiftEdit

 

Algunas otras herramientas que nos puedan servir

 

jsFiddle

Es un editor que permite probar fácilmente algunos Framework javascript tales como MooTools, jQuery, Prototype, YUI, Glow y Dojo, usando HTML y CSS. Muy útil para probar algunos scripts que necesitemos integrar en nuestro sitio.

jsfiddle

jsFiddle

 

CSSDeck

Es una herramienta que nos facilita mucho el experimentar con las hojas de estilo, el render resulta ser convenientemente nuestro navegador, y con una interfaz sencilla y fácil de usar. Además el resultado se muestra al instante.

cssdeck[3]

 CSSDeck

 

Finalmente, muchas de ellas están en estado de prueba (beta) pero son gratuitos y nos pueden ser de mucha utilidad y lo bueno es que tenemos varias alternativas.

 

WWW SQL Designer

Es un entorno de diseño de base de datos creado con Javascript, permite importar y exportar scripts SQL. Su objetivo es facilitarno realizar diagramas E-R directamente en el navegador, sin la necesidad de recurrir a Flash o programa de escritorio. Soporta varios características de las bases de datos, tales como llaves primarias, foráneas, comentarios e índices, también permite guardar nuestros diseños, imprimirlas o exportarlas utilizando el lenguaje SQL. Y viene la licencia BSD.

wwwsqldemo

WWWSQLDesigner | Demo

   / / / / / / / / / /

Cómo poner twitter @anywhere en tu sitio

  7/27/2010    

twitanywhere

Twitter ofrece una manera más sencilla de incluir distintas funcionalidades de twitter en nuestro sitio, entre los más utilizados son la posibilidad de ofrecer una caja de 140 caracteres para publicar directamente desde su sitio y un botón para seguir así como el muy conocido hovercard o información desplegable de los usuarios.

Nota: se utiliza ajax para el proceso y así mismo requiere de un navegador compatible, he encontrado algunos problemas con algunos sitios gratuitos tales como tumblr + Firefox u Opera.

@anywhere comprende únicamente de un documento javascript que debemos incluir en el encabezado de nuestro sitio, y lo único que resta es utilizarlo, así de sencillo.

PRIMERO LO PRIMERO

Debemos crear una aplicación en nuestra cuenta twitter http://dev.twitter.com/anywhere/apps/new 

Registramos nuestra aplicación:

twitterapp

Designamos el nombre de nuestra aplicación, el sitio web, nuestra organización, y CALLBACK es la parte importante, aunque modificable, nos permite dar permisos a nuestro dominio para que nuestra aplicación @anywhere únicamente funcione en ese ámbito. No olvidar elegir el tipo de acceso de tipo Lectura y Escritura.

Luego de haber registrado nuestra aplicación ya podemos acceder a los detalles de nuestra aplicación, y las llaves que utilizaremos para poder utilizarlo, conocido como API Key.

Podemos inclusive darle permiso hasta 5 dominios distintos para utilizar nuestra aplicación.

anywhereurlsautorizadas

Ya sólo con ese dato podemos incluir el script anywhere en el HEAD de nuestro sitio web.

<!DOCTYPE HTML>
<html>
  <head>
   ...
    <script src="http://platform.twitter.com/anywhere.js?id=NUESTRA-API-KEY&v=1" type="text/javascript"></script>
  </head>
  <body>
    ...
  </body>
</html>

 

Colocar Hovercards en nuestro sitio.

hovercardanywhere

El hovercard nos permite desplegar información del usuario twitter como por ejemplo @miusuario el problema es que si lo habilitamos para toda la página cualquier dato que comience con @ se verá afectado inclusive si no existe tal usuario.

Para lo cual es recomendable utilizar una clase para identificarla y sólo habilitar en ese espacio.

Para ello colocamos nuestro script al final del documento, justo antes del TAG </BODY>. 

<script type='text/javascript'> 
  twttr.anywhere(function (T) {
    T('.twitter').hovercards(); 
    });
</script>

Como verán la clase asignada es twitter  la misma que podemos usarla en un elemento DIV por ejemplo: 

<div class="twitter">
Aquí va el usuario @miUsuario que mostrará información adicional usando anywhere
</div>

Que podremos usarlo en cualquier lugar de nuestro sitio web.

Como notarán, el hovercard (información desplegable) nos permite seguir a ese usuario y cuando hagamos clic en Follow, nos mostrará una ventana en la cual hemos de otorgarle permiso a la aplicación usando nuestra cuenta actual de Twitter.

anywhereoauth[3]

Otra característica muy usada es la de incluir un botón para que nuestros visitante nos sigan en twitter, la cual es casi similar al anterior con la única diferencia que no muestra nuestros detalles y utiliza un botón predeterminado.

<span id="follow-twitterapi"></span>
<script type="text/javascript">

  twttr.anywhere(function (T) {
    T('#follow-twitterapi').followButton("miUsuario");
  });

</script>

En este caso está creándose un elemento SPAN cuya ID se está utilizando en el script, la cual generará un resultado parecido a este:

anywherefollowbutton

 

Para terminar, existen más características, tales como incluir una caja de texto para enviar directamente a twitter sin la necesidad de entrar al sitio web de twitter. Muy útil si es que queremos feedback (sugerencias, quejas etc) que nos manden directamente a nuestra cuenta twitter.

Para mayores detalles échenle un vistazo a la documentación oficial de Twitter @anywhere

   / /

Twitter.com mostraría fotos y vídeos

  7/27/2010    

twittermedia

Una nueva configuración denominada “Tweet Media” ha sido habilitada para ciertos usuarios, lo cual podría significar que Twitter muy pronto estaría poniendo a disponibilidad de todos esas nuevas características del sitio web.

Como podrán ver en la imagen superior (gracias Mashable), las nuevas opciones permiten ver fotos y vídeos que cualquier persona haya compartido por este medio, aunque por defecto únicamente podríamos ver de las personas a las que seguimos a menos que activemos esa casilla.

Según Twitter, ellos estuvieron probando dicha característica y lo que vimos fue una pequeña prueba de lo que podría resultar siendo una característica con gran potencial. Mencionan que ya muestran fotos y vídeos en las aplicaciones de Twitter para Android e iPhone.

Finalmente no es muy seguro que esta característica esté disponible puesto que esto cambiaría totalmente la experiencia de usuario y resultaría molesto para muchos usuarios del sitio que están acostumbrados a un entorno sencillo y limpio, a pesar de que muchas aplicaciones de terceros ya ofrecen dichas características y que generalmente la mayoría utiliza en lugar del sitio web.

Esperemos entonces cual será el resultado final de dichos experimentos por parte de Twitter.

via Masahable

   / /

Descubren vulnerabilidad en protocolo de seguridad WPA2

  7/25/2010    

wpa2hole196[3]

Investigadores de AirTight Networks han descubierto una vulnerabilidad en el muy utilizado protocolo de seguridad WPA2 que es parte del estándar 802.11. La vulnerabilidad, denominada “Hole 196”, puede comprometer una red WLAN, dicha vulnerabilidad puede ser aprovechada por los atacantes que ya hayan sido autenticados en la misma red, permitiéndoles desencriptar datos enviados por otros usuarios de tal red inalámbrica.

Este tipo de seguridad utiliza dos llaves para proteger las comunicaciones, en primer lugar un par unicast denominado PTK (Pairwaise Transient Key), que es único para cada cliente y utilizado para proteger el tráfico entre ese cliente y el access point, y en segundo lugar, una llave temporal grupal (GTK) que es conocida por todos los clientes de la red, y utilizada para encriptar el tráfico de emisión (broadcast) que es enviado a todos los clientes de la red.

El ataque no está basado en fuerza bruta, o romper la encriptación AES utilizadas para proteger las comunicaciones. La vulnerabilidad radica en que el cliente malicioso utilice GTK para enviar paquetes falsos a otros usuarios de esa red. Ya que GTK no tiene la característica de detectar paquetes envenenados, pero PTK sí lo tiene.

Md Sohail Ahmad, quien descubrió la vulnerabilidad, dijo que le tomó agregar 10 líneas de código al controlador open source MadWifi más un adaptador wireless para poder implementar el ataque pretendiendo ser la puerta de enlace (Gateway). Al cambiar la dirección MAC del access point, los clientes quienes reciban los paquetes maliciosos, creerán que el remitente es la puerta de enlace, y responderán utilizando PTK, el cual puede ser capturado por el atacante y ser desencriptado.

Esa vulnerabilidad sólo afecta a clientes de la misma red, lo cual limita el riesgo externo, pero de todas maneras es algo alarmante ya que estamos expuestos ya sea en nuestro trabajo, hoteles, entre otros lugares que nos faciliten acceso a internet usando WPA2.

WPA2 es el protocolo de seguridad más reciente disponible para redes inalámbricas, y aún no tiene un sucesor listo para tomar su lugar que corrija esta vulnerabilidad, sólo resta esperar las medidas que tomarán la comunidad de seguridad acerca del problema en este protocolo.

Fuente: NetWorkWorld

   /

Cartoon Spiderman hecha con CSS3 y HTML5

  7/25/2010    

spidercss3

Esta es simplemente una animación increíble, completamente escrita utilizando CSS3 y HTML5 con un poco de ayuda de javascript usando jQuery (sin mencionar los gráficos).

El trabajo es de Anthony Calzadilla () como se muestra en la misma animación, quien ha utilizado como fuente de inspiración la animación de inicio de la serie animada spider-man de 1967.

Explica que el personaje fue creado utilizando Adobe Illustrator junto a Photoshop creadas especialmente para poder ser reutilizadas y así ahorrar la carga de muchas imágenes innecesarias.

Utilizando las propiedades transform-origin que utiliza coordenadas x e y determinó el punto desde el cual la animación y/o transformación (rotate, transform) ocurre.

Aunque no lo crean, la mayor barrera que encontró para realizarla fue el intercambio de escenas en el momento preciso para que coincida con la animación CSS3. Pero utilizando la función delay de jQuery aunque su propósito era usar únicamente las propiedades del CSS3.

Las animaciones sí utilizan la función delay (@key-frame) de CSS3 para iniciar animando en las escenas justo al instante que las escenas se activan con jQuery. Otro inconveniente que tuvo que lidiar fue el control del inicio de la animación y como podrán apreciar los elementos se van cargando al momento de ser mostrados lo cual hace ver una animación incompleta al primer vistazo ya que los elementos no están todos cargados inicialmente, pero al volver a reproducir la animación se logra ver la animación bien realizada, completa y con sonido.

Si desean saber más sobre cómo se realizó, léanlo en Optimum7.com (artículo en Inglés)

Y la animación http://www.optimum7.com/css3-man/ que requiere de un navegador que utiliza Webkit (Chrome, Safari)

Aquí en vídeo, si no logran verlo bien en su navegador, así es cómo debería funcionar.

   / / / / /

Google Chrome Canary Build

  7/25/2010    

canarybuild[5]

El equipo de desarrollo de Google Chrome agregó un nuevo canal de distribución para una versión de Chrome que está en continuo desarrollo al igual que el dev channel; especialmente para quienes están al tanto de lo nuevo que se viene: Canary Builds. A diferencia del canal beta o de desarrollo (dev), Canary puede ser instalada sin sobrescribir nuestra instalación actual de Google Chrome. Eso significa que podemos tener a ambas ediciones en una misma PC.

Actualmente sólo disponible para Windows, y utiliza una carpeta distinta para no interferir con nuestra versión estable de Google Chrome. Google dice que esta edición será casi idéntica a la versión Dev. “Algunas veces si es necesario, podremos incorporar actualizaciones adicionales en Canary build de tal manera que su versión sea superior a la del canal dev.”

canryandchrome

Pero no se podrá establecer a Canary como el navegador por defecto, según Google.

Otra cosa interesante que se muestra al realizar la instalación de esta versión, es el despliegue de una ventana que nos permite elegir el buscador por defecto del navegador.

ballotscreensearch

 

Sin duda resulta muy conveniente para quienes estamos al pendiente de las nuevas características y posibilidades de desarrollo. Ya pueden obtener e instalarlo: Google Chrome Canary Build

   / /

Google Images con nuevo aspecto

  7/21/2010    

googleimages

Google Images, el servicio de búsqueda de imágenes de Google sufrió de un lavado de cara, y es que ahora presenta una forma más compacta de mostrar las imágenes así como un visor para cada imagen.

Google ya cuenta con más de 10 billones de imágenes indexadas, además de filtros que permiten ubicar imágenes de acuerdo a muchas preferencias, también cuenta con una tecnología sofisticada de visión por computadora que es la que está detrás de la opción “Imágenes similares” que por ejemplo puede distinguir leopardos de particulares subespecies basado en patrones que presentan sus manchas.

Pues ahora se realizaron algunos cambios notorios y entre lo nuevo que ofrece la nueva versión de Google Images están:

  • Imágenes ordenadas de manera compacta diseñadas para facilitar la búsqueda de imágenes en cantidad.
  • Cambio entre páginas instantáneo, para que no nos perdamos entre páginas. Podemos ver hasta 1000 imágenes mientras recorremos la página. Mostrando el número de páginas que equivaldrían como una separador.
  • Vistas de miniaturas más grandes en la página de resultados, diseñada para navegadores modernos y pantallas de alta resolución.
  • Un agrandamiento de miniaturas al posicionar el cursor del mouse sobre la miniatura, además de mostrar más información tales como las dimensiones, nombre del archivo, entre otras además de mostrar la opción “Similares.”
  • Una vez que haga clic en una imagen, nos lleva a una nueva página que es el visor, dando la sensación de que se está enfocando más la imagen buscada y detrás de ella la página original, con la finalidad que cuando se haga clic fuera de la imagen se puede acceder a la página que la contiene.
  • Navegación optimizada para teclado de tal manera se pueda realizar el desplazamiento vertical de la página únicamente la parte que contiene las imágenes.

Y para los que están utilizando Google Ads para realizar publicidad, se está ofreciendo una nueva forma de publicidad denominada Image Search Ads únicamente en Google Images, que permitirán incluir una imagen miniatura junto al texto de publicidad.

Los cambios se estarán realizando paulatinamente en todos sus servidores durante los siguientes días. Si estás en algún país que no tenga habilitado esa opción aún, prueba con este http://www.google.com/imghp

lifeisgoodonimagegoogle image


Fuente: GoogleBlog

   / /

Windows Phone 7 disponible como “technical preview”

  7/19/2010    

Win7Phone

Windows Phone 7 de Microsoft alcanza hoy un gran hito “casi”, con el anunció de una edición para revisión “technical preview” colocando a este Sistema Operativo ya a puertas de lanzarse.

Esta versión de Windows Phone 7 , el nuevo Sistema Operativo de Microsoft y que esperan compita con iOS de Apple, muy pronto estará en manos de “miles” de desarrolladores en dispositivos prototipo construidas por fabricantes que incluyen a Asus, LG y Samsung.

De acuerdo a Microsoft, más de 1000 empleados han estado probando el sistema operativo tanto para “usabilidad, tiempo vida de batería, conectividad en red, y muchas otras métricas,” que dice Meyerson, ayudó hacer de esta edición preview de Windows Phone 7 un sistema operativo “sorprendentemente de gran calidad”.

Todavía falta para el lanzamiento de la versión final del Sistema Operativo, pero ya se está recogiendo muchas críticas positivas por parte de varias entidades tales como PCMag, ZDnet, Engadget, Wired, CNET

Fuente: RCRWireless

   /

OAuth y OpenID vulnerables a “Timing Attack”

  7/19/2010    

oauth_and_openid_vulnerable[1]

Los sistemas de autenticación utilizadas por grandes sitios web tales como Twitter entre muchos, podrían estar expuestas a una vulnerabilidad descubierta poniéndolos en riesgo, ya que investigadores han descubierto una falla sencilla que podría corromper un gran número de librerías de software open-source dejando a disposición de hackers los detalles y contraseñas de los usuarios.

La falla fue mencionada por ComputerWorld, que reportó que de las investigaciones de Nate Lawson y Taylor Nelson se podría usar una técnica muy conocida pero complicada denominada “timing attack” (ataque basado en precisión del tiempo) para recolectar contraseñas de sistemas que utilicen estándares tales como OAuth y OpenID.

Robert McMillan explicó cómo Lawson y Nelson podrían satisfactoriamente emplear esta técnica tan bien, que posiblemente no podría hacerse mejor.

El ataque es calificado de difícil porque requiere de medidas precisas. Se logra romper usando los tokens de autenticación al medir el tiempo que toma para una computadora el verificar una firma digital. En algunos sistemas, el servidor verificará la firma encriptada en un token enviado por el usuario para corroborar que se ha loggeado en el sistema. Éste devolverá un mensaje de error tan pronto dé con un carácter malo. Esto significa que una computadora devuelve un error para un token completamente erróneo, un poquito más rápido que otro que contenga el primer carácter correcto.

Al enviar firmas una y otra vez, probando los distintos caracteres y midiendo el tiempo que toma responder a la computadora, los hackers pueden finalmente dar con la firma correcta.

El ataque permite a cualquiera enmascararse como usuario legítimo del sitio sin la necesidad de realizar el login.

Se asumió que debido a que internet haría casi imposible obtener datos precisos, un ataque de este tipo no sería exitoso debido a que el tráfico en la red ocasionaría demoras en tiempos de respuesta de tal manera que siempre fluctuaría. Lawson y Nelson demostraron que esas teorías estaban equivocadas para ello probaron ataques utilizando internet, redes locales e inclusive entornos de cloud computing logrando romper contraseñas en cada uno de esos medios, mediante un filtro que evite mezclar esos ruidos y fluctuaciones de velocidad.

Entonces, ¿qué significa esto para nosotros? Felizmente no es necesario alarmarse tanto.

Lawson y Nelson se han contactado con los desarrolladores involucrados y han sugerido una simple corrección al problema. Para reducir la probabilidad de este ataque, sugieren que los sistemas de autenticación deban retornar una respuesta de contraseña en un cierto tiempo especificado, lo que significa que el ataque basado en tiempo no pueda aprovecharse en un tiempo de respuesta más largo.

La corrección podría ser implementada en solamente 6 líneas de código, de acuerdo a los investigadores.

 

via TheNextWeb

This work is licensed under a Creative Commons Attribution Non-commercial Share Alike license.

   / / /

Científicos develan la técnica de Da Vinci usando Rayos-X

  7/19/2010    

monalisatechnique

 

Aparentemente muchas personas han ido siendo engañados por algún crítico de arte que aseguró varias técnicas pero sin tener la plena seguridad de cual fue la técnica que realmente Leonardo da Vinci había utilizado para poder realizar esas sombras tan notorias y la iluminación en la pintura “Mona Lisa.” Por ello decidieron realizar el análisis al cuadro utilizando rayos-X para descubrir finalmente la técnica que utilizó.

Científicos en París, han descubierto que da Vinci utilizó una técnica muy conocida del renacimiento denominada “sfumato”. Para los nada conocedores de arte (me incluyo), Sfumato (gradiente) es la mezcla de pequeñas capas de pigmento, esmalte, y aceite para crear sombras realistas. La diferencia con Da Vinci era lo intrincado de cómo eran sus capas. Aparentemente, Da Vinci utilizó 30 capas de pintura que sorprendentemente agregó únicamente 40 micrometros de pintura (eso es la mitad del ancho del cabello humano).

La espectrometría fluorescente de rayos X utilizada era no invasiva y permitió a los científicos, ver cada capa de pintura. Es una herramienta tan precisa que puede determinar inclusive la mezcla de pigmentos utilizadas por el artista. Philippe Walter, el científico detrás de todo eso dijo:

En el caso de “Mona Lisa”, Leonardo da Vinci utilizó una mezcla de quizás aceite y resinas, una cubierta con una cantidad muy baja de pigmentos. Y con esas mezclas fue posible crear un aspecto muy impresionante en esta pintura – una realista, como una pintura en 3D.

Sin embargo, a pesar de haber utilizado los rayos X, los científicos todavía afirman que encontrar las pinceladas en la Mona Lisa es imposible.

Fuente: CNN

This work is licensed under a Creative Commons Attribution Non-commercial Share Alike license.

  

Cómo hacer una Google Chrome Web App

  7/11/2010    

Hace no mucho cuando vimos a Google Chrome OS, podíamos ver un apartado de aplicaciones para el navegador Sistema Operativo. Pues esa opción también estará disponible en Google Chrome, y ya es posible jugar con ella en la versión en desarrollo (Dev channel).

Y qué mejor manera de probarlo, haciendo una aplicación por nosotros mismos.

Esta vez vamos a realizar (en realidad convertir) una app web online en una aplicación, es decir listarla en las aplicaciones.

ChromeApps

Si no saben aún cómo activar el modo de Chrome Apps vean el anterior artículo.

De acuerdo, esto va a ser más que fácil, vamos convertir gmail en una aplicación para Chrome Apps, para ello sólo vamos a necesitar tres archivos.

  1. manifest.json (contiene datos que son necesarios para que el navegador lo reconozca como una aplicación)
  2. icon_24.png   (para mostrarla en la pestaña)
  3. icon_128.png (para mostrarla en la lista de aplicaciones)

I. Primer paso, creamos una carpeta para nuestra aplicación.

II. Creamos un documento nuevo cuyo nombre será “manifest.json”

Aquí escribimos lo siguiente:

{
  "name": "Google Mail",
  "version": "1",
  "icons": {
    "24": "icon_24.png",
    "128": "icon_128.png"
  },
  "permissions": [
    "unlimited_storage",
    "notifications"
  ],
  "web_content": {
    "enabled": true,
    "origin": "https://mail.google.com",
    "paths": [
      "/mail/"
    ]
  },
  "app":{"launch": {
    "web_url": "https://mail.google.com/mail/"
  }}
}

Guardamos ese contenido, y finalmente colocamos los correspondientes iconos:

icon_24icon_128<-- clic derecho y guardar o arrastrarlas y soltarlas en la carpeta del proyecto

Y les quedaría algo así

FileGmailApp

Ahora sólo queda hacerla funcionar mediante chrome://extensions

chromeextensions 
Para terminar, cargamos la carpeta que contiene nuestro proyecto. Y eso es todo, ya podemos probar nuestra aplicación en Google Chrome.

gmailappchromeapp

Para hacer una aplicación que sea offline, es lo mismo guíense de esta plantilla.

 

{
   "app": {
      "launch": {
         "local_path": "game.html"
      }
   },
   "icons": {
      "128": "icon_128.png",
      "24": "icon_24.png"
   },
   "name": "Adventure Land",
   "permissions": [ "unlimited_storage", "notifications" ],
   "version": "1"
}

No contiene “web_content” ni “web_url”, sino “local_path” con el archivo html que contendrá la página principal de la aplicación.

Para mayores detalles consulten la documentación oficial de Google Chrome

NOTA: Este tutorial puede no funcionar dependiendo de los cambios que Google haga.

This work is licensed under a Creative Commons Attribution Non-commercial Share Alike license.

   / / /

Cómo probar Google Chrome Web Apps

  7/11/2010    

ChromeApps

Google Chrome Webstore será lanzado a finales de este año, y muchas personas aún no saben de qué se trata.

Se trata de un catálogo de aplicaciones que funcionarán directamente en el navegador de Google, muy parecido al de las extensiones. Utilizando las tecnologías Web, vamos, en realidad son aplicaciones web con la única ventaja de que correrán mejor ya que apunta a ser parte del sistema operativo de Google. Por otra parte, será posible realizar la compra y venta de algunas aplicaciones al estilo de la tienda de Apple.

Viendo la inmensa cantidad de extensiones para este navegador, se espera encontrar muchas aplicaciones enlistadas en la WebStore, a la distancia de un clic y claro de una buena conexión y si es de pago, eso es otra cosa.

Cabe mencionar que Flash también podrá estar disponible, y viendo la inmensa cantidad de aplicaciones (juegos) hechos en Flash, de seguro que éstas coparán más el mercado. Esperemos que no sea así.

El motor de Chrome Apps todavía está en desarrollo, y además la documentación está incompleta; y debido a que los cambios que hagan pueden dejar a una aplicación sin funcionar todavía no es recomendable instalarlas.

Pero si eres un aventurero y ya quieres probar las pocas aplicaciones (que seguramente irán creciendo) que existen, pues aquí les dejo las instrucciones para que vayan probándolas.

La cosa es sencilla, únicamente hemos de descargar la última versión en desarrollo (Dev channel) de Google Chrome, y ejecutarlo pasándole de parámetro el argumento “--enable-apps”

Ejemplo en Windows 7:

ChromeWin7

Primero hacemos clic derecho al icono del programa en la barra de Windows 7, nos aseguramos de anclarlo, y seguidamente otro clic en el icono que está encima de “Anclar...”, finalmente damos en propiedades.

chromeproperties1

En esta ventana que también se puede obtener desde cualquier Acceso directo del programa, vemos la parte que dice Destino, es ahí donde debemos aumentar el flag --enable-apps

chromeenable4apps

NOTA: Sólo agregan --enable-apps al final, si hay comillas, no la pongan adentro sino afuera

Aceptamos los cambios y finalmente volvemos a iniciar el programa usando este Acceso directo modificado, de lo contrario no funcionará.

Ahora queda probar las aplicaciones existentes o crearlas por ti mismo si eres aún más intrépido.

La única que encontré que funcionaba con la última versión de Chrome Dev es AjaxAnimator en el grupo de discusión, sólo instálenla como cualquier extensión de Google Chrome.

Estas son otras, pero que no me funcionaron, al parecer funcionaban anteriormente.

 

 

 

 


 



 




 






 



This work is licensed under a Creative Commons Attribution Non-commercial Share Alike license.

   / / / / /

Adobe Flash apuesta por el 3D

  7/09/2010    

flash3d

Adobe se está esforzando en sacar adelante a Flash, ahora que tiene a HTML5 como principal amenaza, y lo hace con algo relacionado con el 3D.

“¿Qué tipo de API 3D? ¿Triángulos en buffers z de textura real? ¿Aceleración GPU? ¿Todavía mejor? Lo que puedo decir es que olviden lo que han visto antes, va a ser algo grande.”

Menciona Thibault Imbert (gerente de producción de Adobe Flash), para el próximo evento MAX 2010  intitulada “Flash Player 3D Future.”

Para tener más detalles, sólo menciona que esperemos el evento y ahí tener más discusiones y demostraciones de una futura versión del reproductor Flash. La exposición acerca de esto se realizará en Octubre (27 09:30AM puerta 511A), así que todavía hemos de esperar qué es lo que se traen en manos los de Adobe.

Fuente: ByteArray.org

   / / /

Suscribirse a: Entradas (Atom)