Analytics Reporting Integration in SFRA

To record Analytics events in SFRA, you construct the corresponding URL patterns by calling helper methods in the reportingUrls.js module. Each of these helper methods constructs URLs and returns an array of URLs. This array is then passed as a variable (pdict.reportingURLs) to the template reportingUrls.isml.

SFRA Analytics Reporting Helper Script

The app_storefront_base/cartridge/scripts/reportingUrls.js script provides the following helper methods:


getAccountOpenReportingURLs(registeredCustomerCount)         // AccountOpen event
getBasketOpenReportingURLs(currentBasket)                    // BasketOpen event 
getCheckoutReportingURLs(UUID, step, stepName)               // Checkout event
getItemPromoReportingURLs(productLineItem, reportingURLs)    // ItemPromo event
getOrderPlacedReportingURLs(orderCount, reportingURLs)       // UserOrders event 
getOrderPromoReportingURLs(priceAdjustments, reportingURLs)  // OrderPromo event
getOrderReportingURLs(order)                                 // Order and Item events
getProductSearchReportingURLs(productSearch)                 // ProductSearch event
getShippingPromoReportingURLs(shipment, reportingURLs)       // ShippingPromo event

SFRA Analytics Reporting Template

The following code snippet shows the body of the app_storefront_base/cartridge/templates/default/reporting/reportingUrls.isml template:


<isloop items="${pdict.reportingURLs}" var="URL">
	<isinclude url="${URL}" />
</isloop>

For any SFRA template to record Analytics events, include this template. For example, here is a code snippet taken from the app_storefront_base/cartridge/templates/default/checkout/confirmation/confirmation.isml template:


<isif condition="${pdict.reportingURLs && pdict.reportingURLs.length}">
	<isinclude template="reporting/reportingUrls" />
</isif>

Example

The following code shows how controllers in SFRA generate an array of URLs for Analytics events and pass the array to templates during rendering.

This code snippet comes from the app_storefront_base/cartridge/controllers/Order.js controller:


var reportingUrlsHelper = require('*/cartridge/scripts/reportingUrls'); // Instantiate helper module

	...

var reportingURLs = reportingUrlsHelper.getOrderReportingURLs(order);   // Call helper method

if (!req.currentCustomer.profile) {
   passwordForm = server.forms.getForm('newPasswords');
   passwordForm.clear();
   res.render('checkout/confirmation/confirmation', {  // Rendering template includes 
      order: orderModel,                               // the reportingUrls.isml template 
      returningCustomer: false,
      passwordForm: passwordForm,
      reportingURLs: reportingURLs                     // Pass in URL array
      });
} else {
   res.render('checkout/confirmation/confirmation', {  // Rendering template includes 
      order: orderModel,                               // the reportingUrls.isml template
      returningCustomer: true,
      reportingURLs: reportingURLs                     // Pass in URL array
      });
}