Skip to content

Aplicaciones de una sola página

Seguimiento de usuarios

El seguimiento del comportamiento del usuario en aplicaciones de una sola página se puede realizar de manera similar a la forma general de seguimiento de usuarios.

Simplemente tienes que cargar el script de seguimiento de Fanplayr:

https://cdn.fanplayr.com/client/production/loader.js

Y luego esperar a que Fanplayr cargue proporcionando una función "fanplayr_ready":

javascript
window.fanplayr_ready = function (fanplayr, platform) {
  // ...
};

Antes de llamar directamente al seguimiento de la siguiente manera:

javascript
window.fanplayr.reinitialize(DATA);

A continuación se muestra un ejemplo. Puedes usar esto en tu sitio. Las llamadas de seguimiento están ahí simplemente como un ejemplo de cómo funcionaría. Las dos primeras llamadas esperarían a que Fanplayr cargara, y la tercera se realizaría de inmediato (dado que es probable que Fanplayr haya cargado en 2 segundos).

html
<script>
  // Puedes usar este código en tu sitio para almacenar en caché las llamadas a Fanplayr antes de que haya cargado.
  // Ten en cuenta que "window.fanplayr_ready" debe definirse antes de cargar el JS de Fanplayr
  (function () {
    var trackingCache = [];
    var isReady = false;

    // esto se llama cuando la plataforma de Fanplayr está lista
    window.fanplayr_ready = function (fanplayr, platform) {
      isReady = true;
      var i;
      // rastrea cualquier llamada de seguimiento en caché
      for (i = 0; i < trackingCache.length; i++) {
        fanplayr.reinitialize(trackingCache[i]);
      }
      trackingCache = [];
    };

    window.fanplayr_track = function (data) {
      if (isReady) {
        // rastrear
        window.fanplayr.reinitialize(data);
      } else {
        // almacena en caché esta llamada de seguimiento
        trackingCache.push(data);
      }
    };
  })();
</script>

<script>
  // Este bloque de script está aquí para demostrar cómo funcionaría el seguimiento.
  // Ten en cuenta que los datos en sí son válidos para la llamada, pero no rastrearán nada.
  window.fanplayr_track({
    data: {}
  });
  window.fanplayr_track({
    data: {}
  });
  setTimeout(function () {
    window.fanplayr_track({
      data: {}
    });
  }, 2000);
</script>

<!-- Este es el script que necesitas incluir DESPUÉS de establecer la función "window.fanplayr_ready" -->
<script src="https://cdn.fanplayr.com/client/production/loader.js"></script>

Los datos tienen el siguiente formato y son los mismos que se establecen en el seguimiento de página normal.

javascript
{
    version: 3,
    accountKey: '',
    applyToCartUrl: '',
    sessionOfferUrl: '',
    data: {
      lineItemCount: 0,
      numItems: 0,
      subTotal: 0.00,
      total: 0.00,
      discount: 0.00,
      discountCode: '',
      pageType: '',
      categoryId: '',
      categoryName: '',
      productId: '',
      productName: '',
      productSku: '',
      productPrice: 0.00,
      productUrl: '',
      productImage: '',
      currency: '',
      products : [
        {
          id: '',
          sku: '',
          price: 0.00,
          qty: 1,
          name: ''
        }
      ],
      cartAction: 'override'
    },
    custom_data: {
      // ...
    }
  }

Seguimiento de pedidos

El seguimiento de pedidos se basa en el mismo script que se carga en el seguimiento de usuarios. En una aplicación de una sola página, es probable que este ya esté cargado.

Para establecer datos para el seguimiento de pedidos, solo necesitas establecer la variable window.fp_sales_order, incluyendo los mismos datos que en el seguimiento de pedidos general.

javascript
window.fp_sales_orders = {
  version: 3,
  accountKey: '',
  storeDomain: '',
  data: {
    orderId: '',
    orderNumber: '',
    subTotal: 0.0,
    total: 0.0,
    discount: 0.0,
    discountCode: '',
    shipping: 0.0,
    tax: 0.0,
    currency: '',
    orderEmail: '',
    firstName: '',
    lastName: '',
    customerEmail: '',
    customerId: '',
    products: [
      {
        id: '',
        sku: '',
        price: 0.0,
        qty: 1,
        name: ''
      }
    ],
    cartAction: 'override'
  }
};

Luego puedes realizar el seguimiento del pedido llamando a:

javascript
// rastrea el pedido utilizando los detalles en fp_sales_order
window.fanplayr.platform.trackOrder();
// borra el estado actual, en caso de que hagamos otro pedido en la misma sesión
window.fanplayr.platform.state.clear();