Override an API Request

In this tutorial we will guide you through the process of overriding an API Request within Klevu Theme. We will introduce two parameters to every API request made by Klevu Quick Search, SRLP and Category Pages:

  • priceFieldSuffix
  • visibilityGroupID

The details on this page will focus on the quick search for ease of digestion, but the same principle applies to SRLP and Category Pages, which can be seen in the full working example at the bottom of the page.

Postpone Power Up

First we need to tell Klevu not to power up the quick search straight away. We will first apply our overrides and then we will update this flag later on.

klevu.interactive(function () {
    klevu({
        powerUp: {
            quick: false
        }
    });
});

Hook into Klevu Events

Next we will create a new event which will fire once Klevu has completed its initial setup. The name we have chosen here for quick search is setRemoteConfigQuickOverride but you can name this whatever you like.

klevu.coreEvent.build({
    name: "setRemoteConfigQuickOverride",
    fire: function () {
        if (klevu.getSetting(klevu,"settings.flags.setRemoteConfigQuick.build", false)) {
            return true;
        }
        return false;
    },
    maxCount: 150,
    delay: 100
});

This event will wait for a flag setRemoteConfigQuick.build to be set to TRUE. It will asynchronously retry 150 times, waiting 100 milliseconds between each retry. Once this flag is TRUE by the Klevu Theme, it will fire any attached events, which we will define below.

klevu.coreEvent.attach("setRemoteConfigQuickOverride", {
    name: "attachRemoteConfigQuickOverride",
    fire: function () {
        klevu.search.quick.getScope().chains.request.control.addAfter("initRequest", {
            name: "modifyQuickQuery",
            fire: function (data, scope) {
                klevu.search.modules.addCustomerGroupToQuery(data, scope);
            }
        });
    }
});

Next we need to define the function referenced above, addCustomerGroupToQuery, which we keep separate so we can call the same function from Quick, SRLP and Category scopes:

(function (klevu) {
    klevu.extend(true, klevu.search.modules, {
        addCustomerGroupToQuery: function (data, scope) {
            klevu.each(data.request.current.recordQueries,function(key, query){
                klevu.setObjectPath(
                    data,
                    "localOverrides.query." + query.id + ".settings.priceFieldSuffix",
                    klevu_currency + '-' + klevu_loginCustomerGroup
                );
                klevu.setObjectPath(
                    data,
                    "localOverrides.query." + query.id + ".settings.visibilityGroupID",
                    klevu_loginCustomerGroup
                );
            });
        }
    });
})(klevu);

This will override every API request being made to include our additional Klevu API parameters, priceFieldSuffix and visibilityGroupID.

Power Up

Now that we have completed our overrides, we can tell Klevu that we are done and allow it to power up.

klevu({
    powerUp: {
        quick: true
    }
});

Working Example

Putting all of the above together, we have the following which will work for Quick Search and Search Result Landing Pages. You can replicate the SRLP instructions for Category pages, replacing any references of landing to catnav.