Una sinfonía en C#

Un pequeño aporte a la comunidad de habla hispana.

¿Cómo verificar la integridad de los scripts usando subresource integrity?

Los CDN nos permiten tomar recursos como archivos Javascript de terceros (léase frameworks o librerías) sin necesidad de hostearlos nosotros y delegando esa reponsabilidad en servidores más robustos, con replicación, mejor capacidad y con un potencial uso de cache, sin embargo esto podría ser riesgoso.

Por ejemplo si el CDN es hackeado o de alguna manera las peticiones redireccionadas podemos estar potencialmente en peligro de cargar archivos maliciosos en nuestro sitio web, por suerte hay una manera de evitarlo.

Integridad de subrecursos

La integridad de subrecursos (SRI) es una característica de seguridad que permite a los navegadores verificar que un recurso recuperado (de un CDN o cualquier otro origen) no ha sido manipulado permitiendo, para ello, espeficar un hash que el navegador utilizará.

Sencillamente podemos indicar en nuestro tag script un hash calculado con algún algorítmo conocido para que el navegador verifique la integridad del recurso que se intenta cargar, veamos el caso de jQuery por ejemplo:

Llamada “normal” al CDN de jQuery

<script src="https://code.jquery.com/jquery-3.1.0.min.js">

 

El problema acá es que no estamos verificando que el archivo jquery-3-1-0-min.js sea lo que esperamos,

Llamada verificando la integridad del recurso

La forma de agregar la verficación de integridad sería la siguiente:

<script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>

Nótese que agregamos el atributo “integrity” con el valor que indica el hash para verificar la integridad del archivo.

Si intentamos carga el recurso y el hash es incorrecto pasa esto:

image

¿Cómo podemos calcular el hash?

Bien, hay varias formas,:

Y listo, basante simple, más información sobre SRI en al sitio de Mozilla.

Nos leemos.

¿Cómo usar Visual Studia Code como diffviewer para GIT?

Con las sucesivas versiones VSCode es cada vez más potente y lo usamos para más cosas, una para la cual empecé a usarlo hace poco es para hacer diff de versiones usando Toirtoise GIT.

Básicamente cuando comparamos dos versiones de un archivo vemos algo así:

image

Como se ve tenemos la comparación a todo color y hasta una bonita barra de navegación a la derecha para ver los cambios a lo largo de todo el archivo.

¿Cómo configuramos Tortoirse GIT para usar VSCode?

Tenemos que ir a la configuración de Tortoise

image

Y en la opción de “Diff Viewer” elegimos “external” y buscamos donde tenemos instalado VSCode y agregamos el modificador “—diff” en mi caso la línea de comando queda así:

C:\Program Files (x86)\Microsoft VS Code\Code --diff

Y listo, al llamar a diff de GIT nos muestra VSCode. Nos leemos.

Javascript:¿Qué pasa cuando se mezclan el tipado débil y la concatenación?

Todos sabemos que Javascript es debilmente tipado, es decir, existen tipos de datos pero podemos hacer cosas como cambiar el tipo de una variable:

var a = "hola";
console.log(a);
a = 1;
console.log(a)

Y no pasa nada, también podemos comparar diferentes tipos sin mucho problema:

if("hola" == 1){
 //hacer algo
}

Y tampoco pasa nada, de hecho en este caso la comparación resulta ser false, pero podría ser true por la conversión de tipos:

if("1"==1){
//hacer algo
}

Esto último da como resultado true.

El tema del que quiero hablar es una curiosidad que es consecuencia de esto mismo; en el último if lo que hace Javascript es convertir comparar sin importar el tipo, es decir, hace una conversión para saber la equivalencia entre los dos valores, algo similiar pasa cuando concatenamos strings

"hola " + 1

El resultado es "hola 1", ya que Javascript convierte el 1 en un string, hasta acá todo bien, veamos otro ejemplo:

"123"+45

da como resultado "12345", es decir un string concatenado, pero...si hacemos:

"123"-45

Da como resultado 78, porque el signo - no sirve para concatenar strings, pero sí para restar, entonces en el caso de la suma Javascript convierte el 45 en un string y los concatena, pero en el caso de la resta convierte el "123" en un número y los resta, awesome.

Nos leemos pronto.

Problemas deshabilitando Hyper-V en Windows 10

La cosa es que necesitaba correr una máquina virtual en VMWare y éste no es compatible con Hyper-V pero yo lo tenía habilitado (porque los emuladores de Visual Studio lo querieren) así que hice lo que había hecho otras veces en el pasado, ir a “funcionalidades de Windows” y deshabilitar todo lo relativo a Hyper-V

 

image

Después de eso Windows pide reiniciar, decimos que sí, claro, pero al volver  iniciar nos dice que no pudo hacer los cambios y Hyper-V sigue ahí…todo mal.

La solución

Finalmente encontré en Stack exchange la solución, una línea de comando que evita que Hyper-V se reactive (que al parecer era el problema):

bcdedit /set {current} hypervisorlaunchtype off

 

Y si queremos habilitarlo de nuevo

 

bcdedit /set {current} hypervisorlaunchtype auto

 

En fin...cosas...nos leemos

Trucos en CSS: Ellipsis no funciona en las tablas

Hace ya un buen tiempo que contamos con la posibilidad de usar ellipsis, esto es, si un texto es más largo de lo que queremos mostrar simplemente seteamos algunas propiedades css para que llegado un punto se corte y muestre unos puntos al final, algo así:

.text {
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

Y funciona muy bien

image

Excepto que si lo aplicamos en una tabla….no funciona

image

Soluciones:

Bien, hay más de una solución para este problema (como casi siempre en css), todas con sus pro y sus contras.

Primera:

poner display : block

.text {
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
}

 

El único pero es que estamos forzando a la tabla a comportarse como bloque, pero depende de cada caso puede ser aceptable.

Segunda:

Poner un max-width a la celda

.text {
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    
    text-overflow: ellipsis;
}

td.text{
    max-width: 200px;
}

 

En este caso es un poco más elegante ya que no forzamos ningún comportamiento de la tabla más que el que queremos: que no exceda cierto ancho.

Tercera:

El tercero sería poner un div dentro de la celda con la clase text

<table>
    <tr>
        <td><div class="text">Este es un texto un poco largo para mi gusto</div></td>
    </tr>
</table>

Y con el primer css funciona, aunque ya estamos modificando el HTML, como siempre será cuestión de gustos / necesidades.

Dejo un link a una larga discusión en Stackoverflow sobre el tema.

Nos leemos.