Cómo solucionar problemas de las grabaciones

No se están generando grabaciones

Si no obtienes ninguna grabación en tu cuenta Smartlook, puede haber varias razones para ello:

  • No tienes Smartlook instalado en tu página, o se instaló incorrectamente. Asegúrate de instalar Smartlook correctamente.
  • Si estás usando un CMS como WordPress y actualizaste tu sitio web o tema, el complemento podría haberse eliminado. Si ese es el caso, debes volver a instalarlo.
  • Tienes las grabaciones deshabilitadas (apagadas). Simplemente vuelve a activarlos en el Tablero.
  • Los visitantes siguen navegando por el sitio web. Las grabaciones estarán disponibles unos minutos después de que tus visitantes abandonen tu sitio web.
  • ¿Has notado algunas discrepancias entre tu conteo de visitantes en otras herramientas de análisis y el número de grabaciones de visitantes en Smartlook? Consulta la sección de ayuda llamada “¿Smartlook registra a todos los visitantes?

 

Las grabaciones no muestran el diseño correcto de la página

Puede haber varios factores que pueden causar que las grabaciones no recuperen el estilo CSS correcto de tu página, como:

  • Tu sitio web podría estar en un entorno de localhost, una intranet o dentro de una red VPN. Para funcionar correctamente, Smartlook debe instalarse en un sitio web completamente público para que todos los datos puedan recuperarse a través de un proxy en nuestros servidores.
  • La grabación es demasiado corta (es decir, termina después de un segundo) y la conexión no se estableció, lo que significa que el estilo CSS de tu página no se recuperó.
  • El tema de tu sitio web puede tener elementos que no son compatibles (por ejemplo, Canvas, iframes o elementos Flash). Smartlook solo registra elementos HTML, CSS y JavaScript.
  • Tu sitio web tiene CSS dinámico. Obten más información aquí.
  • Es posible que tengas un firewall bloqueando los proxys Smartlook. Verifica tu configuración de seguridad web y asegúrate de tener el encabezado access-control-allow-origin: * habilitado.

Lee más aquí.

¿Puede Smartlook grabar iframes?

No es técnicamente posible que Smartlook grabe iframes porque el script no puede recuperar el contenido que está dentro de dichos elementos.

Problemas comunes de CSS

Al reproducir las grabaciones de los visitantes, las grabaciones pueden mostrar una página con un diseño defectuoso, carente de estilos, parcialmente sin estilo, o que faltan ciertos elementos, como las imágenes, que pueden ser causados por varios factores. A continuación están los más comunes.

Debugging un problema

Cuando reproduces una grabación, Smartlook usa proxies para acceder a tus activos (como las hojas de estilo CSS) y carga los datos para que las grabaciones puedan mostrar los estilos.

Para que una grabación muestre el diseño correcto de la página, cuando abres las Herramientas del desarrollador del navegador, puedes ver los activos de CSS que se están recuperando.

Y siempre que hay un problema con la recuperación de algunos de los activos, puedes ver el activo afectado resaltado (1), así como un mensaje de error en la consola del navegador (2).

Cambios en tu CSS

Cuando realizas cambios en tu CSS, las grabaciones anteriores pueden comenzar a mostrar el nuevo estilo, porque cuando reproduces la grabación, el proxy Smartlook accede a tus activos y recupera la versión actual de tu hoja de estilo CSS.

La solución a esto es crear una nueva hoja de estilo cuando ejecutes una nueva versión de tu CSS y guardes las hojas de estilo con la versión anterior. De esta forma, cuando reproduzcas grabaciones antiguas, Smartlook recuperará la versión anterior del CSS de la hoja de estilo anterior. Cuando reproduzcas grabaciones más recientes, Smartlook recuperará los estilos de la última versión.

CSS dinámico

Otro escenario común es el uso de un CSS dinámico, en el cual se generan hojas de estilo temporales, de modo que cuando accedes a la página en una fecha diferente, la hoja de estilo puede haber expirado. Entonces, lo que está viendos es el estilo de una nueva hoja de estilo.

Sin embargo, los proxies de Smartlook recuperan los datos de la hoja de cálculo activa en el momento en que se realizó la grabación, por lo que si tienes archivos CSS temporales y éstos han expirado, esto hará que las grabaciones se rompan después de un cierto período de tiempo, dado que los proxies ya no pueden acceder a los archivos CSS caducados. Esto va acompañado de un error en la solicitud de CSS.

La solución para esto es mantener los archivos más antiguos para que los proxies Smartlook puedan tener acceso a esos activos. Puedes ponerte en contacto con nosotros y solicitar que habilitemos el almacenamiento automático en caché de los activos de tu cuenta.

Restricciones CORS

El uso compartido de recursos de origen cruzado (CORS) es un mecanismo que permite solicitar recursos restringidos en una página web (por ejemplo, fuentes) desde otro dominio fuera del dominio desde el que se sirvió el primer recurso. Una página web puede incrustar libremente imágenes de origen cruzado, hojas de estilo, guiones, iframes y videos.

Cuando los proxies de Smartlook hacen una solicitud de CSS exitosa a tus servidores, la respuesta incluye un encabezado especial llamado Access-Control-Allow-Origin con un valor de * (comodín), lo que significa que este recurso puede ser solicitado por todos los dominios.

Cuando un recurso carece de esto, no puede ser solicitado por otros dominios, por lo que la solicitud hecha por el proxy Smartlook a tu servidor no tiene éxito, y el reproductor no presentará estos datos en la grabación. Verás un mensaje de error en tu consola que se ve así:

Para resolver esto, debes verificar tu configuración de seguridad y habilitar este encabezado permitiendo CORS. Alternativamente, también puedes usar una extensión como esta, que agrega automáticamente “Access-Control-Allow-Origin: *” a la regla del encabezado de respuesta.