Aplicación de página única

Acerca de las aplicaciones de página única

Las aplicaciones de página única (SPA) son un tipo especial de aplicación web. Un SPA cargará una sola página cuando introduzca un sitio web y, a partir de ese momento, cargará todo el contenido subsiguiente en la misma página en la que navega. Parece que funciona como un sitio web normal, pero al cambiar de página, la página no se vuelve a cargar.

De forma predeterminada, el código de implementación se ejecuta tan pronto como se carga una página web. Sin embargo, dado que los SPAs no se actualizan al navegar entre páginas, el código de despliegue no se volverá a evaluar a medida que navegue entre páginas. Al utilizar las técnicas descritas a continuación, puede habilitar el código de implementación para que funcione sin problemas en su sitio SPA.

Reevaluación automática de la lógica de interceptación al cambiar la dirección URL

Si su aplicación de página única depende del enrutamiento del lado del cliente para la navegación del usuario, puede forzar la reevaluación de intercepts en los cambios posteriores de URL habilitando la lógica Volver a evaluar intercept cuando la URL cambie la configuración en el nivel de proyecto Opinión de sitio web. La verificación de esta opción permitirá la evaluación lógica de intercept además de la evaluación que se produce al cargar la página inicial.

Para activar la reevaluación automática de la lógica de intercept, siga los siguientes pasos:

1. En su proyecto de Opinión de página web, vaya a Configuración.
2. Haga clic en Gestionar proyecto.
3. Seleccione Opciones de proyecto en el menú desplegable.
4. Asegúrese de que se verifica Volver a evaluar la lógica de intercept cuando se modifica la URL en la sección Soporte de aplicación de página única (SPA).

QSI.API.run();

Implementación manual con API JavaScript

Este método describe cómo cambiar el código de despliegue para que se ejecute manualmente.  Esto significa que el código de despliegue no se ejecutará ni evaluará la lógica asociada hasta que se inicie la solicitud de API de JavaScript adecuada.

Para implementar manualmente

1. Vaya a la pestaña Opciones.
   
2. Haga clic en el menú desplegable Gestionar proyecto.
3. Seleccione Opciones de proyecto.
4. Active la opción Cargar proyecto manualmente.
   
5. Vuelva a la ficha Intercepts y, si lo desea, establezca la lógica en su Intercept o en el conjunto de acciones.
   
6. Coloque el código de implementación en su sitio web, preferiblemente en un encabezado o pie de página global para que se cargue en todas las páginas.
7. Añada las solicitudes de API de JavaScript adecuadas en función de las veces que desee que su sitio web haga referencia al intercept. Consulte la siguiente sección para estas solicitudes.

Solicitudes de API de JavaScript

Si desea que Qualtrics evalúe su proyecto en una sola instancia, utilice estas dos solicitudes:

1. Esta solicitud carga el código de implementación para cualquier intercepts y diseños de la página. La API de “carga” es la misma que la recarga de una página que tiene código.

   QSI.API.load();

   Consejo Q: Si ha activado Cargar proyecto manualmente en las opciones del proyecto, no tendrá que llamar a esta API para cargar el código de implementación al cargar la página inicial. Solo será necesario forzar la carga para tener en cuenta los cambios de estado en la página que se producen sin recargar.
2. Esto inicia la evaluación del código de despliegue y hará que aparezca cualquier Diseño si pasa las condiciones de visualización.

   QSI.API.run();

Si desea que Qualtrics evalúe su código de proyecto más de una vez en la misma página, repita los tres pasos siguientes cada vez:

1. Esta solicitud elimina el código de implementación de todos los intercepts o diseños presentes en la página.

   QSI.API.descarga();

2. Esto carga el código de implementación para cualquier intercepts o diseño de la página. Es lo mismo que volver a cargar la página.

   QSI.API.load();

3. Esto inicia la evaluación del código de despliegue y hará que aparezca cualquier Diseño si pasa las condiciones de visualización.

   QSI.API.run();

Preguntas frecuentes