Saltar al contenido principal

El script de Varify no carga correctamente en WordPress con WP Rocket

Última actualización el 21 oct 20264 min de lectura

Cómo reconocer el error​

Tu sitio web funciona con WordPress y usa el plugin WP Rocket. El script de Varify no carga correctamente. Los experimentos no se entregan o solo con retraso, no llegan datos o llegan muy pocos al informe, o el objeto window.varify no está definido en el navegador.

important

El script de Varify debe cargar sin modificaciones y sin retraso para que las variantes se entreguen antes de que el visitante vea la página. Por lo tanto, WP Rocket no debe optimizarlo, retrasarlo ni almacenarlo en caché.

Por qué ocurre esto​

WP Rocket optimiza los archivos JavaScript de dos maneras. Ambas pueden afectar al script de Varify:

  • Delay JavaScript execution: Retrasa los scripts hasta que el visitante interactúa con la página. En el proceso, el snippet inline con el ID de Varify se convierte en una dirección data:text/javascript;base64. El script comienza demasiado tarde, por lo que las variantes parpadean o no se entregan.
  • Minify / Combine JavaScript files: Descarga scripts externos y sirve una copia desde tu propio dominio, desde la carpeta /wp-content/cache/min/. La página carga una copia almacenada en caché en lugar del archivo actual de app.varify.io, por lo que los cambios en tus experimentos no llegan.

Cómo comprobar si WP Rocket es la causa​

Con las herramientas de desarrollador de tu navegador (Chrome: clic derecho en la página, "Inspeccionar"), puedes ver desde dónde se carga el script.

Paso 1: Pestaña Elements – ¿se cambió el snippet?​

Abre la pestaña "Elements" y busca (Ctrl/Cmd + F) "varify". Si WP Rocket ha convertido el snippet inline con el ID de Varify en un script con src="data:text/javascript;base64…" y el atributo data-rocket-status, el snippet fue modificado. Debajo, varify.js se carga desde tu propio dominio bajo /cache/min/.

Pestaña Elements que muestra el snippet de Varify convertido por WP Rocket

Paso 2: Pestaña Network – ¿de dónde viene varify.js?​

Abre la pestaña "Network", recarga la página e introduce "varify" en el filtro. Haz clic en el archivo varify.js y comprueba la "Request URL". La dirección correcta está en app.varify.io. Si el archivo está en tu propio dominio, por ejemplo bajo /wp-content/cache/min/1/varify.js, WP Rocket está sirviendo una copia en caché. El valor "Age" en los encabezados de respuesta muestra cuánto tiempo lleva la copia en la caché.

Pestaña Network con la request URL de varify.js en el propio dominio

Paso 3: Comparar sin WP Rocket​

Añade ?nowprocket a la URL de la página. Esto evita las optimizaciones de WP Rocket. Si el script de Varify se carga allí desde app.varify.io y funciona, WP Rocket es la causa.

Pestaña Network con ?nowprocket en la dirección y varify.js desde app.varify.io

Solución: Excluir el script de Varify con data-nowprocket​

WP Rocket excluye del retraso todo script que contenga la palabra clave nowprocket, por ejemplo como atributo. Por lo tanto, añade el atributo data-nowprocket a ambas etiquetas script del snippet de Varify: el script inline con tu ID de Varify y el script que carga el archivo varify.js.

<script data-nowprocket>
window.varify = window.varify || {};
window.varify.iid = YOUR ACCOUNT ID;
</script>
<script data-nowprocket src="https://app.varify.io/varify.js"></script>
important

Copia el snippet con tu ID personal desde tu cuenta de Varify (Tracking Setup) y añade únicamente el atributo data-nowprocket. No cambies nada más en el código.

Alternativa: Excluir el script en la configuración de WP Rocket​

Si no puedes editar el snippet, exclúyelo en WP Rocket. En WordPress, abre "Settings > WP Rocket > File Optimization" e introduce estos valores:

  • En "Delay JavaScript execution", en el campo "Excluded JavaScript Files": varify.js y window.varify. La segunda entrada excluye el snippet inline.
  • En "Minify JavaScript files", en el campo "Excluded JavaScript Files" (y, si está activado, en "Combine JavaScript files"): varify.js.
  • Guarda los cambios.
important

Para scripts externos, usa el nombre del archivo y no el dominio. Si "Minify JavaScript files" está activado, el archivo se almacena localmente en tu servidor, y una entrada con app.varify.io ya no coincidiría.

Borra la caché y comprueba el resultado​

  1. Borra la caché de WP Rocket, por ejemplo con "Clear cache" en la barra de administración de WordPress. Si es necesario, borra también la caché de tu hosting y de tu CDN.
  2. Recarga la página en la pestaña Network con la opción "Disable cache" activada y filtra por "varify".
  3. Comprueba que varify.js se carga desde app.varify.io con estado 200 (como en la última captura de pantalla de arriba).
  4. Introduce window.varify en la consola. Si se devuelve un objeto, el script está cargado.

Si el problema persiste​

  • Comprueba si la consola muestra el mensaje Refused to load the script 'data:text/javascript;base64…'. Si es así, una Content Security Policy de tu sitio web bloquea las direcciones data: que crea WP Rocket. Permite data: en la directiva script-src o excluye el script de Varify de la optimización como se ha descrito anteriormente. Tu proveedor de hosting puede ayudarte con esto.
  • Comprueba si otros plugins de optimización o caché, una CDN o funciones de tu hosting modifican JavaScript. Pueden tener los mismos efectos.
  • Comprueba que el snippet de Varify esté incluido solo una vez en la página.
  • Si necesitas más ayuda, contacta con nuestro equipo de soporte.

Conclusión​

En sitios de WordPress con WP Rocket, el plugin a menudo retrasa o cachea el script de Varify. Añade el atributo data-nowprocket a ambas etiquetas script del snippet de Varify, o excluye varify.js y el snippet inline en WP Rocket. Luego borra la caché y comprueba en la pestaña Network que varify.js se carga desde app.varify.io.

Artículos relacionados​