Mi Visual Studio no sincroniza el archivo actual en el Explorador de Soluciones

Una cosa muy útil cuando estamos programando con Visual Studio es que, si tienes varios archivos de código abiertos a la vez, cuando cambias de uno a otro se seleccione dicho archivo en el explorador de soluciones.

De ese modo, al cambiar de archivo, sabes exactamente en qué proyecto concreto y en qué parte del proyecto estás en cada momento. Esto es especialmente útil en desarrollos grandes, formados quizá por decenas de proyectos y cientos o miles de archivos de código.

En Visual Studio 2010 esto era así por defecto (y si no me equivoco ni siquiera lo podrías cambiar). En versiones más recientes de Visual Studio como Visual Studio 2013 o 2015, esto no es así. Por defecto, cuando abres un archivo no se selecciona automáticamente en el explorador de soluciones.

En proyectos pequeños esto no tiene importancia, pero en proyectos grandes es un fastidio (o al menos a mi me lo parece).

¿Cómo puedes hacer que se sincronice lo que estás viendo con el Explorador de Soluciones?

Muy fácil. Es solo saber en dónde está un ajuste.

DESCUBRE CÓMO ACTIVARLO en el post original.

TRUCO: Hacer "bundling" de archivos JavaScript o CSS sin necesidad de herramientas externas

Este es un truco rápido pero muy útil para programadores Front-End que trabajan con HTML, CSS y JavaScript.

Como todo el mundo sabe (o debería saber), con HTTP 1.1 cada petición que se envía al servidor añade "peso" a la carga total de la página porque se debe abrir una nueva conexión, se deben enviar las cabeceras y recibirlas, hay un máximo de conexiones abiertas a la vez, etc…

Por ello, si la página incluye por ejemplo 10 archivos .css que en conjunto pesan 250KB, su descarga va a tardar más que si descargásemos ese mismo contenido exactamente, con el mismo peso, pero en un solo archivo .css.

Esto no ocurre con la nueva versión HTTP 2, pero no siempre está disponible todavía.

Como en una aplicación o en una página web cada milisegundo cuenta, se suelen utilizar dos técnicas habitualmente para disminuir el efecto de tener varios archivos y disminuir su peso:

  • "Bundling" o empaquetamiento: consiste en combinar varios archivos dentro de uno solo para que, aunque ocupen lo mismo, puedan descargarse con una sola conexión de una sola vez, con lo que se ahorra tiempo total de descarga y procesamiento. Lo verás más a menudo como "bundling" que es el término que se usa en inglés (y casi todo el mundo en español).
  • "Minificación" o minimización: se trata de reducir al máximo el tamaño de los archivos quitando todo lo que no es necesario: espacios en blanco, tabuladores, cambios de línea… Generalmente puede ir acompañado además de ofuscación del código para dificultar su seguimiento. El primer término "minificación" es incorrecto en español, pero se utiliza mucho porque es como se le llama en inglés (minification).

Existen multitud de herramientas que se pueden encargar de llevar a cabo estas tareas antes de pasar un proyecto a producción (siendo Grunt y Gulp los programadores de tareas más conocidos: ambos tienen plugins para hacer esto).

Sin embargo lo que muchos no saben es que en el propio sistema operativo Windows tenemos una herramienta muy simple que nos permite hacer "bundling" instantáneamente sin necesidad de instalar nada más.

SIGUE LEYENDO para averiguar cómo hacerlo y como evitar posibles problemas.

No me aparece el DataContext en un LinqDataSource

Linq to SQL es una tecnología precursora del actual Entity Framework que fue pionera en sacar partido a Linq para crear un ORM fácil de utilizar con esta tecnología. Su principal limitación es que solo funciona con SQL Server y que los "mapeos" deben ser 1 a 1 con las tablas (una tabla = 1 clase). Sin embargo es tremendamente fácil de usar y tiene un diseñador visual muy efectivo, por lo que a mucha gente (incluyéndome yo mismo) nos gusta mucho y es válido para la mayor parte de las situaciones si trabajas con el gestor de datos de Microsoft.

En ASP.NET Web Forms (otra tecnología ahora en retroceso pero tremendamente efectiva para ciertos tipos de aplicaciones Web, como por ejemplo las orientadas a gestión) se incluye un control para acceso visual a datos llamado LinqDataSource que está especialmente diseñado para trabajar con esta tecnología. Este control combinado con los diferentes controles enlazados a datos (y especialmente los ListView y DataPager) permite crear interfaces web orientadas a datos de manera visual, efectiva y rápida.

Sin embargo en algunas versiones de Visual Studio, por ejemplo la 2015, existen algunos problemillas debido a la forma en la que está configurado el entorno por defecto.

Haz la siguiente prueba: abre Visual Studio 2015, crea un nuevo proyecto web vacío de tipo de ASP.NET Web Forms:

Proyecto-Nuevo-WebForms-VS2015

Ahora añade una nueva clase de tipo Linq2SQL. Enlázala, por ejemplo, a la base de datos Northwind para poder hacer una prueba, y arrastra algunas tablas sobre el diseñador.

Ahora, en una nueva página .aspx vacía arrastra un control Linq2SQL. Al ir a configurarlo verás que la lista desplegable de los DataContext ¡está vacía!:

LinqDataSource_Vacio

Es decir, no se ha reconocido la clase de contexto de datos que tenemos en el archivo Linq2SQL. ¿Cómo es posible si todo el objeto de ese control es, precisamente, reconocer este tipo de contextos de datos?

El problema es que el proyecto de Web Forms, por defecto, no incluye ninguna referencia a la biblioteca de Linq y por eso no reconoce el DataContext, lo cual es una cosa extraña.

La solución es sencilla: hay que añadir al web.config de nuestra solución la siguiente referencia directamente en la sección de "assemblies":

<compilation debug="true" targetFramework="4.5.2">
      < assemblies>
        < add assembly="System.Data.Linq, Version=4.0.30319.17929, Culture=neutral, PublicKeyToken=b77a5c561934e089" />
      </assemblies>
< /compilation>

De este modo el proyecto logrará encontrar los DataContext y podremos seleccionar sin problema nuestra clase Linq2SQL:

LinqDataSource_OK

Problema solucionado.

¡Espero que te sea útil!

A mi tablet con un Atom Z3735F Baytrail no le dura la batería ni un día: ¿Cómo solucionarlo?

Si tienes un tablet con Windows 10 y un procesador Intel Atom Z3735F QuadCore de tipo "Baytrail", probablemente tienes un problema con tu dispositivo: la batería en reposo apenas te dura un día, ¿verdad?.

En un tablet lo que haces normalmente es, tras haberlo utilizado, pulsas el botón de encendido/apagado y éste se pone en un estado de baja energía que apenas consume y que te permite acceder de nuevo a él instantáneamente.

El problema con este tipo de tablets, por otro lado tan comunes, es que existe un problema de gestión de energía que hace que cuando apagas la pantalla en realidad el equipo no entre en modo de baja energía, sino que se queda trabajando de la manera habitual solo que con la pantalla apagada.

Esto se traduce en un consumo energético muy alto porque todos los sistemas están funcionando con normalidad, por lo que al final el nivel de la batería baja a toda velocidad y cuando vas a encenderlo de nuevo al cabo de unas horas te encuentras con que está prácticamente agotada. Un verdadero fastidio.

SIGUE LEYENDO para averiguar:

  • A qué se debe este problema y cómo diagnosticarlo en tu caso
  • Cómo solucionarlo
  • Qué tablet me he comprado y por qué no te recomiendo que lo compres tú Confused smile

Cómo obtener una referencia al ámbito global en cualquier entorno JavaScript (HTML, Node.js, Windows Scripting Host…)

El ámbito global de JavaScript es el ámbito superior en el que se definen las variables y que contiene algunas de las funcionalidades globales del entorno de ejecución.

Se trata de un objeto especial que:

  • Siempre está disponible
  • Se llama de manera implícita, es decir, no es necesario mencionar su nombre explícitamente para usar sus métodos o propiedades, al contrario que con cualquier otro objeto.
  • Según indica el estándar ECMAScript, este objeto global no dispone de constructor ni de prototipo y no se puede invocar como una función al igual que el resto de los objetos.

Si en un fragmento de código JavaScript definimos una variable o una función como estas fuera de todo contexto, o sea, para simplificar, sin ser dentro de una función):

var miVar = 0;
function sumar(a, b) {
   return a+b;
}

Lo que estamos haciendo es crear sendos miembros en el objeto global, que es el que constituye dicho ámbito: una variable y una función globales.

Es decir, declarar una variable o una función global implica crear un miembro de este objeto global.

Además, se definen otros ámbitos según en dónde declaremos cada variable, y estos ámbitos se "contienen" unos a otros. Es decir, los ámbitos van en una jerarquía que comienza en el ámbito más restringido y sube hasta llegar al ámbito global. En nuestro ejemplo híper-sencillo tendríamos tan solo dos ámbitos: el global y el de la función:

JavaScript-Ambitos

Desde el ámbito de la función tenemos acceso al ámbito global.

Todo esto de los ámbitos se complica mucho más (tenemos clausuras, por ejemplo). En el estándar podemos leer sobre ello (les llama entornos léxicos) y que nos de vueltas la cabeza.

Como sabemos, aunque nació en los navegadores, JavaScript en la actualidad se utiliza para casi todo, y podemos encontrarlo en casi cualquier entorno imaginable: servidores, dispositivos embebidos, sistemas operativos…

Aunque el estándar ECMAScript describe el objeto global y qué debe contener, no es igual en todos los entornos.

En un navegador el ámbito global lo constituye la ventana en la que se ejecuta el script, y de hecho podemos acceder a él mediante el objeto window. Por ejemplo, a partir del código anterior que definía una variable y una función podríamos escribir:

alert(miVar);
alert(window.miVar);

Y veríamos que son instrucciones equivalentes, ya que al ser una variable global queda definida dentro del ámbito global (es decir, de window en un navegador).

En otros entornos, sin embargo, no disponemos de un objeto window que actúe de ámbito global. Por ejemplo, en Node.js existe un objeto llamado global (o GLOBAL, es un alias) que nos permite acceder al ámbito global. En Windows Scripting Host el objeto global no tiene un nombre definido que lo represente y que nos permita acceder a él directamente… Cada entorno, por tanto, tiene sus particularidades.

La pregunta entonces es: ¿Cómo podemos acceder al ámbito global de JavaScript de manera genérica e independiente del entorno?.

SIGUE LEYENDO para descubrir:

  • Cómo enumerar propiedades de objetos
  • Distintas técnicas de acceso al ámbito global y cuál es la verdaderamente correcta
  • Qué tenemos en el ámbito global ennavegadores, Windows Scripting HOst y NOde.js
  • Por qué en Node.js nos devuelve "cosas extrañas"

Módulo para notificaciones web desde el navegador con HTML5

campusMVP_Notification

Estos días he estado creando un módulo JavaScript para facilitar el uso de las notificaciones del navegador usando la API estándar "Web Notifications" del World Wide Web Consortium (W3C).

La idea es poder mostrar notificaciones nativas al usuario (de las que aparecen al lado del reloj en Windows, por ejemplo) pero desde aplicaciones web. Por ejemplo, cuando llega un nuevo correo (como hace GMail), o cualquier otra circunstancia que necesitemos notificar en segundo plano al usuario, pero desde el navegador.

Actualmente el único navegador que NO las soporta es Internet Explorer / Edge, y no parece que tengan intención de soportarlas tampoco, pero en todos los demás funcionarán sin problemas.

En su día escribí un artículo explicando con detalle cómo utilizarlas "a pelo", sin usar ninguna biblioteca intermedia. Esto es una especie de continuación. Lo que he hecho es crear una biblioteca que, en mi opinión, hace más sencillo el uso de esta característica. Además homogeniza cuestiones como el tiempo de mostrar una notificación o el estado actual de permisos para mostrarlas.

Se trata de un modulo dual y se puede utilizar tanto directamente, incluyéndolo con una etiqueta <script> normal y corriente, como mediante inyección de dependencias con AMD (por ejemplo con Require.js).

He creado un repositorio en GitHub que incluye:

  • Documentación completa del módulo, con explicaciones de las funciones expuestas, su funcionamiento, etc… De momento está solo en inglés, pero entiendo que no debería suponer demasiado problema.
  • El código fuente completo (WebNotifications.js). Incluye comentarios explicativos para entender mejor cómo funciona.
  • La versión minimizada del módulo (WebNotifications.min.js), para usarlo con la mínima carga posible (962 bytes). Incluye un archivo de mapa (WebNotifications.min.js.map) para ayudar a la depuración en producción si fuera necesario.
  • Un archivo de ejemplo de uso (WebNotificationsTest.htm) que implementa todas las funcionalidades para comprobar que funcionan (debe usarse desde un servidor web: en local no funcionará).

¡Espero que lo encuentres útil!

La extraña cabecera "Upgrade-Insecure-Requests" y cómo gestionarla en el servidor

Como todo programador web que se precie, más temprano que tarde acabarás por utilizar el inspector de tráfico de Google Chrome o cualquier otro analizador de protocolos como por ejemplo el magnífico Fiddler. Estas utilidades sirven para inspeccionar todo el tráfico web saliente y poder ver exactamente qué datos se intercambian, poder modificar peticiones y respuestas, etc… lo cual es de gran ayuda para depurar las aplicaciones Web.

Si inspeccionas tráfico generado por Google Chrome verás una cabecera muy rara en casi todas las peticiones dirigidas a través de HTTP:

Upgrade-Insecure-Requests

¿Qué es esta cabecera "Upgrade-Insecure-Requests"?

SIGUE LEYENDO…

TRUCO: Reproducir automáticamente un vídeo HTML5 desde un determinado punto

flat-video-player

Para reproducir un vídeo (o audio) de forma nativa desde una página Web lo único que tenemos que hacer es usar una etiqueta <video>, y si el elemento multimedia está en un formato apropiado se reproducirá sin problemas:

<video src="miVideo.mp4" autoplay controls>
</video>

Esto es solo rascar la superficie, pero lo pongo solo para situarnos.

Si necesitamos reproducir el archivo, no desde el principio sino desde una posición posterior, normalmente deberíamos recurrir a un poco de código JavaScript para establecer el punto actual con la propiedad currentTime del objeto correspondiente.

Lo que ya no es tan conocido es que en la mayor parte de los navegadores (todos excepto Internet Explorer), es posible conseguir ese efecto simplemente añadiendo un parámetro a la URL que indica dónde está almacenado el vídeo. Este parámetro es #t=.

Por ejemplo, si el vídeo anterior lo incluimos de esta manera:

<video src="miVideo.mp4#t=90" autoplay controls>
</video>

El vídeo empezará a reproducirse automáticamente a partir del segundo 90, saltándose por tanto, de entrada, el primer minuto y medio. Si no le hubiésemos puesto el atributo autoplay no se reproduciría automáticamente, pero quedaría ya cargado directamente en ese punto, de modo que al darle al botón de "play" comenzaría a reproducir desde allí.

Podemos indicar también el otro extremo del intervalo, es decir, dónde queremos que se detenga automáticamente, usando el mismo parámetro:

<video src="miVideo.mp4#t=90,130" autoplay controls>
</video>

De esta manera se reproducirá desde el segundo 90 y se detendrá automáticamente al llegar al segundo 130 (2 minutos y 10 segundos del inicio).

Si omitimos el primer parámetro (es decir, ponemos una coma y luego un número) el vídeo o el audio se empezará a reproducir desde el principio y se detendrá automáticamente al llegar al tiempo indicado:

<video src="miVideo.mp4#t=,130" autoplay controls>
</video>

En este ejemplo se pararía a loas 130 segundo.

Es posible especificar valores decimales para finar más:

<video src="miVideo.mp4#t=10.25,130.5" autoplay controls>
</video>

Y también expresiones en formato de hora (hh:mm:ss):

<video src="miVideo.mp4#t=00:00:10.25,00:02:10.5" autoplay controls>
</video>

Que sería equivalente al ejemplo anterior, pero en este caso el segundo tiempo (el de detención) es más fácil de leer.

Recuerda que esto funcionará sin problema en Chrome, Firefox y Opera, pero Internet Explorer hará caso omiso. En ese caso lo reproducirá de la forma normal. Si es importante que funcione en todos los navegadores entonces deberás usar JavaScript. Si simplemente es una cuestión de asistir un poco al usuario y no es tan importante que empiece justo donde decimos, esta solución te valdrá perfectamente pues funcionará para un % muy alto de los navegadores del mercado. Y te evita programar 🙂

¡Espero que te sea útil!

Cómo cambiar el orden de los algoritmos criptográficos de SSL en Windows Server / IIS

Hace poco veíamos cómo solicitar un certificado digital para SSL usando un algoritmo de hash moderno, y no el que se usa por defecto en IIS.

En esta ocasión vamos a ver cómo podemos modificar en Windows Server, y por lo tanto en Internet Information Server, el orden de preferencia de los diferentes conjuntos de algoritmos de cifrado disponibles. De este modo nos cerciorarnos de que los más modernos y seguros van primero en la lista y por lo tanto se les da preferencia a la hora de cifrar las comunicaciones, obteniendo un servidor más seguro.

La cosa es bastante sencilla. Sólo hay que saber en dónde tocar y entender lo que se toca.

SIGUE LEYENDO para averiguar:

  • Cómo configuramos el orden de precedencia de los conjuntos de algoritmos criptográficos
  • Cuáles deberíamos priorizar en un servidor habitualmente
  • Cuál es el caso ideal y cómo podríamos ponerlo en marcha
  • Cuáles son las pegas de ese caso "ideal"

Cómo solicitar certificados con SHA-2 en lugar de SHA-1 en IIS y Windows Server 2008

Dentro de las tareas criptográficas necesarias para realizar comunicaciones seguras están los algoritmos de resumen digital o hashing. Uno de los más utilizados desde hace varios lustros es el algoritmo SHA-1.

El problema es que este algoritmo ha sido ya vapuleado por algunos expertos en seguridad a partir de 2004, y hoy en día se considera inseguro, por lo que la mayor parte de fabricantes de navegadores y otros sistemas han anunciado que irán dejando de soportarlo paulatinamente:

Lo que hay que hacer es utilizar SHA-2 en cualquiera de sus 6 variantes, y más en concreto se suele utilizar SHA-256.

El consenso general es que a partir del día 1 de Enero de 2017 los navegadores que se encuentran con una conexión segura SSL basada en el algoritmo SHA-1 pasarán a considerarla insegura y mostrarán un aviso de seguridad.

Es más, hoy en día esto ya está ocurriendo puesto que Chrome, si despliegas la información del sitio pulsando en el candado, te advierte de que el sitio está usando un conjunto de cifrado obsoleto:

Certificado-SSL-Hacienda-Obsoleto

En el caso de nuestra querida agencia tributaria encima es que ni siquiera proporciona información sobre transparencia de certificados, por lo que además el icono del candado muestra ya una advertencia en la barra de direcciones. La Administración siempre por delante, ya se sabe…

Bien, el caso es que dentro de poco si tu certificado SSL no está correctamente generado para poder utilizar algoritmos de cifrado y hashing modernos, vas a tener un problema.

Esto implica fundamentalmente dos cosas:

  1. Permitir únicamente el uso de protocolos seguros en el servidor: básicamente deshabilitar SSL 2.0 y SSL 3.0 y recurrir a TLS, mejor a una de sus versiones más recientes (la 1.1 o la 1.2). Fíjate que en el caso de Hacienda, sí que usan TLS 1.2, pero como utilizan SHA1, Chrome advierte igualmente de que es un conjunto de cifrado obsoleto. En Enero de 2017 simplemente lo marcará como inseguro.
  2. Solicitar un certificado SSL indicando que queremos utilizar alguna variante de SHA-2. Esto es precisamente lo que vamos a ver en este post.

Si utilizas Internet Information Server en algún sistema que no sea con Windows Server 2012 (que lleva IIS 8.x), no podrás solicitar el certificado de la manera habitual. De hecho, si generas un certificado desde la opción correspondiente del IIS Manager, cuando vayas a comprarlo lo más probable es que el proveedor te avise y te diga que debes hacer la solicitud con SHA-2. Por ejemplo, si copias y pegas tu solicitud en esta página de Symantec, te dirá qué tipo de solicitud estás haciendo (pulsa para aumentar):

SSL-SHA-Cert-SHA1

En este caso, como vemos, se está solicitando con SHA-1, que es lo que utiliza por defecto Internet Information Server 7.x. Conviene usar esta herramienta gratuita para verificar nuestra solicitud antes de comprar el certificado.

Entonces, si IIS genera una petición de certificado con SHA-1 ¿cómo podemos obtener una solicitud apropiada con SHA-2?.

Para ello debes utilizar la consola de gestión del sistema directamente, y hacer caso omiso de la administración de Internet Information Server.

SIGUE LEYENDO para ver una explicación detallada paso a paso de cómo conseguirlo.