Script Inside

Entradas

Mostrando las entradas etiquetadas como navegadores

HTTP/2 para los usuarios de Google Chrome

septiembre 21, 2016

Si eres un webmaster y has notado que los usuarios de Google Chrome que accedían anteriormente a través de HTTP 2 ahora lo hacen por HTTP 1, estas en el sitio correcto. Esto es debido a un cambio de política en la más reciente actualización de Chrome , lanzada a finales de mayo, que elimina el soporte a NPN, un método para actualizar una conexión a HTTP 2. La única manera que tienen estos usuarios de Chrome de acceder a tu sitio web por HTTP 2 es cambiando a un navegador diferente. Pero tú, como administrador, puedes restaurar el soporte a HTTP 2 actualizando OpenSSL a versiones superiores o iguales a la 1.0.2. Para saber mas detalles sobre este comportamiento puedes visitar el siguiente enlace en inglés . Este post está destinado principalmente a CentOS 7 con instalaciones de Nginx desde el repositorio oficial. La instalación oficial de Nginx no está compilada con OpenSSL, con lo cual utiliza la instalación que tengas en tu CentOS, lo malo de esto es que a fe...

Enviar archivos con AJAX y jQuery en HTML5

Con la evolución de los navegadores y la llegada de HTML5 ya no es necesario utilizar librerías extras para simular subir archivos por AJAX, la mayoría de estas librerías lo que hacían era utilizar FLASH o hacer un IFRAME para capturar esta subida de archivos. Con HTML5 ya no es necesario esto. Esto es gracias a la introducción del objeto FormData que nos permite crear formularios al vuelo. Asignar un formulario existente a un objeto FormData: var formElement = document.getElementById("someFormElement"); var formData = new FormData(formElement); O puedes recorrer el formulario con jQuery para solo agregar los campos que te interesan: var formData = new FormData(); $('#someFormElement :input').each(function(){ var input = $(this); switch (input.attr('type')){ case "checkbox": ...

Habilitar la copia automática de textos al portapapeles

En anteriores ocasiones he escrito como copiar desde el portapapeles con JS y copiar al portapapeles con JavaScript , pero para aplicar ambas opciones en muchos navegadores no está disponible y en otros hay que hacer configuraciones adicionales. Este tutorial es aplicable a los navegadores Firefox cualquier versión, para Internet Explorer no es necesario habilitar nada en concreto y para el resto de navegadores está pendiente de analizar. Abrimos el navegador y en la barra de navegación (dónde se ponen las direcciones de las páginas web –recuadro rojo imagen 2- ) escribir “about:config”, nos aparecerá la siguiente advertencia: No os preocupéis ignorar este mensaje y pulsad el botón “Tendré cuidado, lo prometo”, el check “Mostrar esta advertencia la próxima vez” marcado también. Una vez pulsado el botón nos aparecen un listado con todas las opciones de configuración de nuestro navegador, es una pantalla como esta: Dónde pone Filtro escribimos “signed.applets.codebase_principal_suppo...

Favoritos en Firefox, Chrome e Internet Explorer

febrero 20, 2012

Más que una comparativa es un análisis desde mi propia experiencia personal en cuanto a la pestaña de favoritos en estos 3 navegadores. El pionero en este sentido fue Safari pero luego el primero en hacerlo a su estilo fue Google Chrome aunque es una copia bastante parecida al de Safari con una vista previa de los sitios pero más minimalista y menos llamativa, aquí os dejo cómo se ve en la versión actual de desarrollo (v18.0.1017.2 dev-m): Internet Explorer lo sacó luego y a mi entender salvo algunas diferencias es el más limpio y más coqueto, aquí os dejo la imagen en Internet Explorer 10 Developer Preview : Ambas versiones son minimalistas y son capaces de dejar sitios en blanco y solo gastan una casilla por cada dominio o subdominio favorito, cosa que no hace Firefox, que aparte de llegar tarde (en la versión 13) lo hace mal, los sitios se repiten indiscriminadamente, no es capaz de detectar que sitios se visitan más y cuales no y da preferencia a uno de un dominio ya agregado q...

Octubre 2011: Cuotas de mercado en internet

febrero 17, 2012

He encontrado este interesante artículo en internet sobre las cuotas de mercado basadas en las conexiones a internet y no en el número de dispositivos .

Crear certificados digitales en Windows

Este manual se podría decir que es una actualización del artículo wiki crear e instalar certificados digitales en Apache HttpServer . Lo primero que debemos hacer es descargarnos la distribución de OpenSSL para Windows . Para los que no lo sepan y parafraseando a la Wikipedia decir que OpenSSL es un software open source para libre descarga que incluye un paquete de herramientas de administración y bibliotecas relacionadas con la criptografía, que suministran funciones criptográficas a otros paquetes como OpenSSH y navegadores web para acceso seguro a sitios con el protocolo HTTPS, herramientas que ayudan al sistema a implementar el Secure Sockets Layer (SSL). Una vez que hemos descargar OpenSSL debemos ejecutar el Símbolo del sistema y navegar hasta la ruta de instalación de este programa. Esto es muy importante porque de hacerlo desde otras carpetas nos puede dar un error del tipo 'openssl' is not recognized as an internal or external command, operable program or batch...

Desventajas de minimizar código JavaScript con Minify

noviembre 02, 2011

Minify es una utilidad escrita en PHP5 que permite eliminar los caracteres innecesarios del código fuente sin cambiar su funcionalidad permitiendo incluir en una sola línea de código múltiples archivos JavaScript o CSS reduciendo con ello el tiempo de carga de nuestra página web. Pero todo lo que brilla no es oro y aunque llevo tiempo utilizando Minify hay algunas pegas a tener en cuenta: 1.- hay que tenerlo instalado en el entorno real y en el de desarrollo porque sino a la hora de combinar los archivos hay que estar descartando estas líneas de código 2.- los debuggers de los principales navegadores son incapaces de encontrar correctamente el archivo y en algunos casos la línea de error cuando se produce un fallo en JavaScript lo cual hace más complicada la tarea de corrección de errores 3.- puede dar problemas con las codificaciones de los archivos comprimidos 4.- debes tener configurado apache correctamente con una librería adicional (redirect) que no viene instalada por defecto 5...

Bug Google Chrome con JSON

septiembre 21, 2011

Esta es la semana de los errores y hoy me ha pasado uno muy curioso, al principio pensaba que era un bug de la función json_encode de PHP pero al comprobar mi script con Firefox me he dado cuenta que el error radicaba en la forma de tratar los objetos JSON recibidos como respuesta de un AJAX por Google Chrome. Versiones de los navegadores: Google Chrome 15.0.854.15 dev-m Mozilla Frefox 7.0 El error en cuestión es la ordenación de los índices de un objeto JSON cuando estos son numéricos. Por ejemplo supongamos que tenemos el siguiente array: Array ( [236] => aargelich [251] => aferrer [245] => ambordas ) Y ahora codificamos este array con PHP y lo enviamos a nuestra web a través de AJAX, la codificación correcta de este array sería: {"236":"aargelich","251":"aferrer","245":"ambordas"} Sin embargo en el Google Chrome recibimos como respuesta el siguiente: {"236":"aargelich",...

Sitios populares en IE9

Lo de la pantalla de sitios populares no es nada nuevo en realidad pero me ha llamado la atención que a diferencia de otros navegadores como Chorme, precursor en estas sugerencias, Internet Explorer 9 no lo hace con una captura de pantalla sino que analiza el favicon y muestra una barra de intensidad con el color predominante en este favicon, esta barra lo único que nos indica es el uso del sitio. No sé si os parece más útil que una captura de pantalla pero lo que si es indudable es que hacer esto es mucho más complicado que una imagen en miniatura de una captura de pantalla de los sitios que visitamos. Yo por mi parte le doy un 10 a Internet Explorer 9 en innovación en este sentido.

Bug con el plugin de jquery WYSIWYG

febrero 07, 2011

El plugin de jquery WYSIWYG es uno de los que más utilizo y de hecho utilizaba una de las versiones antiguas la 0.5, el motivo que me hizo actualizar es que esta versión no permite crear cuadros WYSIWYG (What you see is what you get – Lo que ves es lo que obtienes) dentro de un dialog de jquery ui, o sí los crea pero no permite editarlos ni escribir en ellos. La solución fue bastante simple, actualizar a la última versión del momento la 0.95 pero con ella vinieron nuevos errores: En efecto, como podréis notar los botones se duplicaban y esto lo he reportado en el bug número 218 de la página de Google Code. La solución no obstante es bastante sencilla y pasa por crearnos una variable interna en el plugin que yo la llamé initStart y en la línea 494 dentro de la función que anexa el menú agregar estas líneas: if ( this .initStart) return ; this .initStart = true ; Con esto estaría solucionado y nos quedaría de la siguiente forma: El motivo de esto es la doble llamada (línea...

Navegadores actuales: cuotas de mercado

Para darle un poco de dramatismo al post podría decir que la lucha por ser el navegador favorito de los internautas es encarnizada cuando menos, Apple, Microsoft, Mozilla, Google y Opera luchan cada vez más por no perder al menos su cuota de mercado en este mundo de los navegadores web. Cada vez vemos cómo la frecuencia de actualización de estos es mayor y se busca fundamentalmente mayor velocidad de carga, mayor compatibilidad con los estándares y una rapidez mayor procesando los archivos javascript, todo esto sin descuidar una interfaz cada vez más minimalista. Esto de las estadísticas nunca es absoluto y generalmente cada uno barre para su propio patio, por eso, para elaborar la siguiente gráfica he optado por hacer una media aritmética entre 2 sitios de estadísticas y cerca de un millón de visitas de mi propia web de cine. Las estadísticas consultadas corresponden al w3schools y a statcounter . Veamos el gráfico de arriba hacia abajo. Lo más claro es el fracaso de Mic...

Bug en jquery 1.4.4 con la función each

El motivo por el que muchos utilizamos jquery es por la comodidad que nos brinda al trabajar con varios navegadores y un mismo código, además de eliminar prácticamente toda las validaciones de errores que pueden detener la ejecución de una página web. Dicho esto en la versión 1.4.4 hay un error muy curioso en la tan útil función each, imaginemos el siguiente código: $.each(datos, function(clave, valor) {}); En él la variable datos (en mi caso) es un objeto json, el problema viene dado cuando esta variable está vacía. En Google Chrome 10 el error reportado en el archivo jquery es que la función length no puede ser aplicada a un objeto nulo, mientras que Mozilla Firefox 3.6.13 se queda más corto y solo nos dice que object es nulo (en la versión normal de jquery) ó que j es nulo (en la versión minimizada). Para reportar un bug en jquery podemos hacerlo desde el enlace anterior. Este bug en concreto tiene el número 8008 . Otros bugs que he reportado recientemente para Chr...

Error con el border color en Google Chrome 10

Hoy he estado probando algunas propiedades CSS en las tablas y me ha pasado una cosa muy curiosa en Google Chrome 10. El error se aplica a las propiedades de los bordes como el color y el ancho y ocurre cuando tenemos 2 celdas adyacentes en las cuales ambas tienen un colspan no coincidente. Os dejo la imagen para que se entienda mejor, aparece en la parte superior el error en Google Chrome con el border-color y debajo cómo debería aparecer, en este caso en Firefox que sí está correcta la interpretación de esta propiedad border-color para celdas con colspan adyacentes. Espero que lo corrijan pronto.

Google Chrome intenta hacernos programar bien

noviembre 22, 2010

Desde las versiones más recientes de Google Chrome se pueden ir observando cambios en la gestión de los códigos javascript, por ejemplo en las redirecciones. Mientras que en versiones anteriores y en otros navegadores como Firefox la siguiente instrucción redirigiría a la página 1, las últimas versiones de Chrome (8 y 9) redirigen a la página 2 en el siguiente código: if ( true ) location.replace = 'pagina1' location.replace = 'pagina2' Lo correcto sería: if ( true ) location.replace = 'pagina1' else location.replace = 'pagina2' Otra de las cosas que podemos notar es que cada vez es más estricto con el HTML y por ejemplo si tenemos unas etiquetas </script> sin cerrar con ‘>’ o sea </script ese archivo en concreto lo cargaría pero los siguientes no, por ejemplo el archivo 2 del siguiente ejemplo no seria cargado: < script type = "text/javascript" src = "archivo1" > </script <script type= ...

jQuery, ajax, chrome y tabs

septiembre 14, 2010

Hoy ha ocurrido algo muy curioso, tenemos un código que envía por ajax una petición al servidor y el dato devuelto lo asimila otra función para enviar un formulario, veamos el código: $.ajax({ type: "POST" , url: "carga.php?Accion=Identifica" , data: "variable=" +valor, async: true , contentType: "application/x-www-form-urlencoded" , dataType: "text" , success: function (tipo){ enviarFormulario(tipo,valor); } }); La única desventaja es que enviar un formulario desde dentro de la función success en chrome es identificado como un pop-up no como una nueva ventana o un nuevo tab, en firefox si funciona correctamente, la solución paso por declarar una variable anterior que guarde los datos recogidos del ajax, el ajax declararlo como NO asíncrono y luego enviar el formulario fuera. Curioso sin dudas ¿os ha pasado? Actualización: Código de la función que envía el formulario function enviarFormulario(tipo,dato){ var...

Bug en firefox al ordenar arrays

Si tenemos el siguiente código javascript: var x; var mycars = new Array(); mycars[2] = "Saab" ; mycars[1] = "Volvo" ; mycars[0] = "BMW" ; for (x in mycars) { document.write(mycars[x] + "<br />" ); } Esto sacaría por pantalla lo siguiente: BMW – Volvo – Saab Sin embargo si la diferencia de índices es muy grande firefox interpreta los índices como cadenas (el resto de navegadores los continúa ordenando bien), por ejemplo si fuera: var mycars = new Array(); mycars[1500] = "Saab" ; mycars[30] = "Volvo" ; mycars[20] = "BMW" ; En vez de sacar por pantalla BMW – Volvo – Saab sacaría Saab – Volvo – BMW ¡Curioso!

El navegador que espero

agosto 27, 2009

Haciendo un break entre los post de los test realizados creo necesario soñar un poco y ponerme a imaginar qué navegador me gustaría tener uniendo todas las cosas que me gustan de los actuales. De Firefox me gustaría tener esa gran comunidad que posee con el sinfín de complementos y que estos no penalizaran el rendimiento del mismo. Me gusta también que puedas mover las pestañas entre ventanas o arrastrarlas para crear nuevas. De Internet Explorer me quedaría con la independencia total que tienen una pestaña de otra, también echo por Google Chrome pero a mi modo de ver no tan magistralmente. Me gusta mucho que cuando abres una nueva pestaña a partir de otra tengan el mismo color, ese pequeño detalle me encanta. Y me quedo con su gestión de descargas, es la de toda la vida, a la que estoy acostumbrado, ni por mucho la mejor pero si la que necesito. De Chrome me quedo con su barra de direcciones multiuso, muy pero que muy útil, me gusta su diseño y su página de inicio de la versió...

Celtic Kane Javascript Benchmark

agosto 27, 2009

De los test específicos realizados este es el que me ha aportado unos datos más relevantes además de ser de un grupo independiente no asociado a ningún motor JavaScript de ningún navegador, por tanto la imparcialidad está, como mínimo, más garantizada. La ventaja de este test es que prueba los elementos más básicos de JavaScript y además AJAX, con el cual me llevé la gran sorpresa pues si la prueba de AJAX no se hubiera realizado Safari sería el glorioso vencedor pero por esta prueba es, aunque suene increíble, el aplastado perdedor, incluso por debajo –y ni yo me lo creo- de Internet Explorer 8. Las pruebas se realizan sobre la mayoría de los objetos de JavaScript: Arrays, Date, Math, RegEx, String; además incluye pruebas sobre el DOM, el manejo de errores y la conflictiva declaración de AJAX. Los resultados son los siguientes: Si hubiésemos eliminado la prueba de AJAX los resultados hubiesen sido totalmente distintos, veamos: El test lo podéis realizar desde aqu...

V8 Benchmark Suite

agosto 27, 2009

Si el anterior test estaba diseñado por los miembros de WebKit este está diseñado por los miembros de Google Chrome y más concretamente de su nuevo y reluciente motor JavaScript V8, por lo cual está de sobra decir quien se lleva la palma en el mismo. Este test es al contrario de los demás, el que alcance la mayor puntuación es el mejor. La suite V8 consta de 7 pruebas independientes escritas por diferentes programadores y en ellas se basan para optimizar Google Chrome, las pruebas miden desde el propio Kernel del SO hasta encriptación, expresiones regulares y manipulación de datos. La última versión la podemos encontrar aquí junto con una explicación breve (en inglés) y un histórico de las mismas. Los resultados arrojados fueron los siguientes: Recordad que en este test mientras más grande mejor, o sea que aquí el tamaño SI importa. Como aclaración decir que al salir la versión 4 de Safari se dijo que era la más rápida y luego de pasar este test quedó por detrás de Chro...

SunSpider WebKit Benchmark

agosto 27, 2009

El test SunSpider realiza una serie de pruebas sobre el navegador para saber el tiempo que le toma para procesar ciertas instrucciones, las cuales abarcan: renderizado 3D; acceso a arrays, propiedades de objetos y variables; procesos matemáticos con enteros y punto flotante; control de flujo (bucles, recursión, condicionales); encriptado; performance de objetos "date"; expresiones regulares y tratamiento de cadenas. La fiabilidad de este test ha surgido porque realiza un ciclo de 5 repeticiones de cada prueba y hace una media estadística de estas mediciones además de brindar el porcentaje de error de las mismas. Es un test creado por los desarrolladores de Webkit el motor de renderizado de Safari y también Chrome lo utilizó en sus diseños anteriores por lo que su V8 está basado en Webkit. Está de más decir que es lógico que estos dos navegadores salgan bien parados en esta comparativa. Veamos los resultados: Y esta es la tabla comparativa según los bloques de prueba...