Buscando artículos sobre " Programación"
2-agosto-2018
admin

Parámetros externos en Python

Ejemplo de configuración en el eclipse de parámetros externos para una aplicación realizada en python.




Como se puede ver para leerlos es simplemente:

import sys
....
variable = sys.argv[1]
16-julio-2018
admin

Uso de wait en Selenium

En los test de selenium podemos esperar a que se ejecuten determinadas acciones para facilitar el testeo de las web.

Ejemplo 1: Este ejemplo espera hasta 10 segundos antes de lanzar una excepción TimeoutException a menos que encuentre el elemento myDynamicElement para regresar dentro de 10 segundos.
Es interesante combinarlo con las ExpectedConditions aunque también se puede hacer consulta estática.

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

driver = webdriver.Firefox()
driver.get("http://somedomain/url_that_delays_loading")
try:
    element = WebDriverWait(driver, 10).until(
        EC.presence_of_element_located((By.ID, "myDynamicElement"))
    )
finally:
    driver.quit()



Ejemplo 2: En este se establece 10 segundos como el tiempo de espera máxima para buscar cualquier elemento.

from selenium import webdriver

driver = webdriver.Firefox()
driver.implicitly_wait(10) # seconds
driver.get("http://somedomain/url_that_delays_loading")
myDynamicElement = driver.find_element_by_id("myDynamicElement")



Fuente

9-junio-2018
admin

Spring-Boot y variables de entorno

Formas de pasar información a una aplicación java realizada con spring-boot:

Variable de entorno
Podemos crear una variable de entorno añadiendola directamente desde la consola o bien en el propio entorno de desarrollo (la imagen es con un eclipse.)

set MI_VARIABLE=Hola!!

Podemos acceder a ellas desde la apliación así:

String myVar = System.getenv().get("MI_VARIABLE");



Línea de comandos
Podemos pasar propiedades por línea de comandos, por ejemplo:

java -jar -DmiVariable=Hola programa.jar

Para su lectura bastaria con

@Autowired 
private Environment env;
.....
String value = env.getProperty( "miVariable" );
.....



application.properties y application-xxx.properties
En el fichero application.properties puedes añadir también variables:

var.prueba.1=valor1
var.prueba.2=valor2
....

Adicionalmente en Spring-Boot podriamos crear otros ficheros application-xxx.properties. XXX hace referencia al profile que quieras usar, podemos definir que profile se va a utilizar mediante la propiedad spring.profiles.active. Es decir, si queremos que los valores de las variables se obtengan prioritariamente del fichero application-local.properties deberíamos asignar el valor local a la propiedad spring.profiles.active.

spring.profiles.active=local


Documentación profile

27-diciembre-2017
admin

Primera aplicación con IONIC

Ionic es una herramienta, gratuita y open source, para el desarrollo de aplicaciones híbridas basadas en HTML5, CSS y JS. Está construido con Sass y optimizado con AngularJS.
Se trata de una tecnología muy valida siempre que se impongan al cliente ciertas restricciones en las versiones de los dispositivos soportados. Es decir: Android 4.4+, IOS 8+ y Windows 10+ (Phone y Desktop).

Requisitos previos
– Tener instalado jdk 1.8
– Para android, tener instalado la sdk android (puedes usar el Android Studio)
– Tener instalado Gradle (descargar, descomprimirlo y luego meterlo al path)

Instalamos el framework

	npm install -g ionic@beta
	npm install -g ionic
	npm install -g cordova


Creamos la primera aplicación de ejemplo, podemos elegir uno de estos tipos:
– tabs : a simple 3 tab layout
– sidemenu: a layout with a swipable menu on the side
– blank: a bare starter with a single page
– super: starter project with over 14 ready to use page designs
– tutorial: a guided starter project

	ionic start AppExampleIonic sidemenu  --typescript


Comandos a conocer:

        //Lanza la aplicación en el emulador
	ionic serve

        //Lanza la aplicación en varios tipos de plataformas en el navegador
	ionic serve --lab

        //añade las plataformas a utilizar
	ionic cordova platform add ios android windows

        //Lanza la aplicación android
	ionic cordova run android

        //cosntruye la apliación android
	ionic cordova build android

        //Generar una version de android para producción
	ionic cordova build android --release

        //Generar una version de android para producción
	ionic cordova build ios --prod

Fuente

20-diciembre-2017
admin

Transiciones CSS. Mejorando el diseño.

A continuación se muestran dos links con información sobre transiciones.

https://www.bootply.com/tagged/transition
Se trata de una web que contiene diferentes ejemplos de transiciones realizadas con Bootstrap.


https://daneden.github.io/animate.css/
Se trata de una css que contiene un monton de animaciones muy interesantes. Se instala con npm mediante:

npm install animate.css --save

Y luego solo tienes que incluirla:

< head>
  < link rel="stylesheet" href="animate.min.css">
< /head>
15-diciembre-2017
admin

Modulo de seguridad Helmet para node.js

Se trata de una librería que provee de 12 módulos para establecer unos cabeceras de seguridad en tu servidor node.js. Concretamente:

Module Included by default?
contentSecurityPolicy for setting Content Security Policy  
expectCt for handling Certificate Transparency  
dnsPrefetchControl controls browser DNS prefetching
frameguard to prevent clickjacking
hidePoweredBy to remove the X-Powered-By header
hpkp for HTTP Public Key Pinning  
hsts for HTTP Strict Transport Security
ieNoOpen sets X-Download-Options for IE8+
noCache to disable client-side caching  
noSniff to keep clients from sniffing the MIME type
referrerPolicy to hide the Referer header  
xssFilter adds some small XSS protections

Para instalarlo sería con el comando:

npm install helmet --save 

Unos ejemplos de uso:

var express = require('express')
var helmet = require('helmet')
var app = express()

//Uso por defecto sería:
app.use(helmet())

//Activar individualmente las funciones.
app.use(helmet.noCache())
app.use(helmet.frameguard())

//Desabilitar alguna funcionalidad y usa el resto de las de por defecto.
app.use(helmet({
  frameguard: false
}))

Fuente

2-diciembre-2017
admin

HPKP: HTTP Public Key Pinning

El Public Key Pinning es una extensión del protocolo HTTP (Hypertext Transfer Protocol) que permite definir el juego de claves públicas (Public Key Set) para las futuras conexiones SSL/TLS con un host. De esta manera el cliente puede saber, en su primera toma de contacto, en qué claves públicas puede confiar mientras se establece la conexión a este host. Este procedimiento se conoce como modelo “Trust On First Use” (en español: confianza en la primera aplicación). Cada entrada de una clave verificada se denomina “pin” (de ahí el nombre de “pinning” dado a este mecanismo). Todos los pines creados se envían al cliente en el encabezado HTTP y se guardan aquí durante un determinado periodo de tiempo.

Cuando se realiza una nueva solicitud de conexión, el cliente comprueba si la cadena de certificación propuesta para la transmisión SSL/TLS contiene una clave pública (key) filtrada previamente a través de HPKP. Si no es así, por ejemplo en el caso de un certificado falso, se genera un mensaje de error y no se establece la conexión. Este proceso de verificación se conoce también como validación de pin. Este que sigue es un ejemplo de las entradas de los pines en el encabezado HTTP:

Public-Key-Pins:
pin-sha256=”d6qzRu9zOECb90Uez27xWltNsj0e1Md7GkYYkVoZWmM=”;
pin-sha256=”E9CZ9INDbd+2eRQozYqqbQ2yXLVKB9+xcprMF+44U1g=”;
pin-sha256=”LPJNul+wow4m6DsqxbninhsWHlwfp0JecwQzYpOLmCQ=”;
max-age=2592000; includeSubDomains; report-uri=”http://example.com/pkp-report”

El ejemplo muestra las cuatro directrices que debe contener una entrada pin en el encabezado HTTP:

pin: la directiva pin es la parte más importante de la entrada. Como tal, está compuesta por un nombre y un valor. El nombre proporciona indicios sobre el algoritmo utilizado para el cifrado. Hasta la fecha solo es posible usar SHA256. El valor hash, que se encuentra dentro de las comillas, es una cadena Base64 codificada que también se conoce como huella digital (Fingerprint). Es necesario fijar una directiva pin propia para cada llave (backups).

max-age: la directiva max-age especifica el periodo de validez de un pin en segundos e indica al cliente cuánto tiempo debe considerar como clave segura a una Public Key determinada. En el ejemplo mencionado, los pines enumerados se descartarán después de 30 días (2.592.000 de segundos).

includeSubDomains: esta directiva es opcional y no requiere ningún valor. Esta es la encargada de señalar al cliente que las reglas de certificación definidas no solo se aplican al dominio solicitado, sino también a todos los subdominios pertenecientes al host.

report-uri: si se fija la directiva report-uri, cualquier error de validación del pin se enviará al URL especificado. Este no necesariamente tiene que estar en el mismo dominio de Internet que el host contactado para informarle de los intentos fallidos de configuración.



Podemos crear nuestro pin mediante la aplicacion OpenSSL de la siguiente forma:

set OPENSSL_CONF=c:\OpenSSL\bin\openssl.cnf

//creamos una clave privada
openssl genrsa -out primkey.key 4096

//creamos el csr para esa clave nueva 
//    (nos pedirá que rellenemos una serie de datos)
openssl req -new -key primkey.key -sha256 -out primkey.csr

//obtenemos la huella digital
openssl req -pubkey < primkey.csr | openssl pkey -pubin -outform der 
                | openssl dgst -sha256 -binary | openssl enc -base64

Fuente
Fuente 2

10-noviembre-2017
admin

Carga de una imagen para previsualizarla

Ejemplo de como podriamos cargar en una página HTML una imagen obtenida desde el disco y hacer una previsualización de ella usando javascript.

En la pagina podemos añadir un objeto de formulario de tipo file, así como una imagen donde cargaremos la que seleccionemos:

   < input type="file" id="files" name="files[]" 
                       class="btn btn-default btn-file" / >
   < img src="" id="imgPrevisualizacion" class="img-rounded" 
                       height="50" width="50" / >

Ahora sobre ese objeto programamos con javscript el evento change. De tal forma que cada vez que se seleccione una imagen se lance al detectar ese cambio.

function archivo(evt) {
      var files = evt.target.files; //obtenemos la lista de archivos

      for (var i = 0, f; f = files[i]; i++) {         
           if (!f.type.match('image.*')) { //comprobamos de que es una imagen
                continue;
           }
       
           var reader = new FileReader();
           reader.onload = (function(theFile) {
               return function(e) {
            	   //asignamos la imagen seleccionada
            	   document.getElementById("imgPrevisualizacion").src 
                                                           = e.target.result;
               };
           })(f);
            reader.readAsDataURL(f);
       }
}
//creamos el evento
document.getElementById('files').addEventListener('change', archivo, false);
1-noviembre-2017
admin

Exportar código HTML a imagen con html2canvas

Gracias a la librería html2Canvas se pueden exportar el código html como si fuera una imagen.

Dado este código html:

< div id="convierteImagen">
   < b>Hola Mundo< /b>
< /div>

Voy a poner dos ejemplos de uso.

Ejemplo 1 – Si simplemente queremos que en la propia página se cargue una imagen igual al trozo html con html2Canvas sería tan fácil como:
1.1 – Ponemos un botón que será el encargado de lanzar la función JavaScript que realice la tarea.


1.2 – Cómo se puede ver en la función a html2Canvas basta con indicarle el objeto que se quiere capturar.

function renderImg(type) {
	html2canvas(document.getElementById(type), {
		onrendered : function(canvas) {
			document.body.appendChild(canvas);
		},
		width : 470
	});
}

Ejemplo 2 – Vamos a suponer que queremos que se descarge el codigo html anterior como si fuera una imagen al hacer click en un boton. Para ello:
2.1 – Creamos un botón y en su evento onclick invocamos a la función que crea la imagen y la lanza para descargar. Además, ponemos una etiqueta < a > cuyo id será downloadLink (no se vera en la página pero la usaremos para lanzar la imagen).



2.2 – Creamos la función JavaScript que utiliza html2Canvas para crear la imagen.

function downImg(type) {
	html2canvas(document.getElementById(type), {
		onrendered : function(canvas) {
		   var dato = canvas.toDataURL("image/png");
		   var anchor = document.getElementById("downloadLink");
                   //asignamos un nombre al link
		   anchor.setAttribute('download', 'NombreParaImagen.png');
                   //asignamos la imagen
		   anchor.setAttribute('href', dato);
		   anchor.click(); //forzamos el click
		},
		width : 470
	});
}

Ejemplos

14-julio-2017
admin

Objeto JSON en javascript: JSON.stringify vs JSON.parse

El objeto JSON contiene los métodos necesarios para analizar el JavaScript Object Notation (JSON) y, a su vez, convertir valores a JSON. A continuación se esponen los métodos de los que consta:

JSON.parse(text[, reviver])
Convierte una cadena de texto en un objeto de javascript.

Parámetros
text: La cadena que convertirá a JSON. Vea el objeto JSON para una descripción de la sintaxis JSON.
reviver (Opcional): Función que sobreescribe cómo se transforma el valor producido por el parsing.

Retorna el objeto que se corresponde con el texto JSON entregado.

JSON.parse('{"p": 5}', function (key, value) {
    if(key === "") return value;     
    return value * 2;             
});                           
// { p: 10 }



JSON.stringify(valor[, remplazo [, espacio]])
Convierte un valor dado en javascript a una cadena JSON.

Parámetros
valor: El valor que será convertido a una cadena JSON.
función de remplazo (Opcional): Es una función que altera el comportamiento del proceso de conversión a cadena de texto, o un array de objetos String o Number que representan una lista de elementos validos que se incluyen en la cadena JSON.
espacio (Opcional): Es un objeto de tipo String o Number que es usado para insertar un espacio en blanco dentro de la cadena de salida JSON para su mejor comprensión. Si es un número, se entiende que representa el numero de espacios a agregar; este numero tiene un limite de 10 espacios; numeros menores que 1 inplican que no se utiliza espacio alguno. Si es un cadena (sólo los 10 primeros caracteres son tomados en cuenta), esta es usada como espacios en blanco. Si este parámetro no se define o este es nulo no se agrega ningun espacio.

Retorna un string JSON representando el valor dado.

function replacer(key, value) {
  // Filtrando propiedades 
  if (typeof value === "string") {
    return undefined;
  }
  return value;
}

var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7}; 
var jsonString = JSON.stringify(foo, replacer);
// '{"week":45, "month":7}'

Fuente Json

Páginas:1234567...13»

Categorias

Linkedin