Tracking visitors attributes

Return to the docs

Visitor attributes are a powerful way to bind custom and personalized data to your visitors. This can ultimately be helpful when exploring the visitor journey across your website or application pages.

Set visitor's attributes

An attribute can be set to the current visitor by calling the visitor.set() function. This function receives an object as argument, as seen below:

cyanstats.visitor.set({ foo: 'bar' }); // and/ or
cyanstats.visitor.set({ id: 1, name: 'John Doe' }); // and/ or
cyanstats.visitor.set({
    subscription: {
        active: 'yes',
        context: 'newsletter'
    }
}); // ...

There might be cases when you would like to set attribute to your visitors as soon as the page load. Since the script tag loads asynchronously, the cyanstats library might be undefined when you call it.

To work around this issue, you must call your script in the onload event from the script tag. E.g:

<script
    async
    src="https://cyanstats.com/cs.js"
    onload="onCyanStatsLoadHandler"
></script>

<script >
    function onCyanStatsLoadHandler () {
        if (window.cyanstats) {
            cyanstats.visitor.set({ /* attributes here */ });
        }
    }
</script>

Get visitor's attributes

Since you can store attributes from your visitors, Cyan Stats also allows you to retrieve these attributes across sessions from the same visitor to your website or application. Retrieving previously set attributes can be done by calling the visitor.get() function.

const data = cyanstats.visitor.get(); // returns an object

Assuming the example given for the visitor.set() function, calling visitor.get() would result in the following returned object:

{
    foo: 'bar',
    id: 1,
    name: 'John Doe',
    subscription: {
        active: 'yes',
        context: 'newsletter'
    }
}