Skip to main content

JavaScript SDK

You can embed Vero’s tracking code in your website using our JavaScript/TypeScript SDK. Below shows how you can get started.
This SDK is also available as an NPM package for advanced use cases (e.g., integrating in React or Node.js applications). Please refer to the package’s README for more information.

Install the SDK

You will need the tracking API key to set up the SDK. You can find your API key on the Settings page of your Vero account. Then, insert the following code into your <head> section of every HTML document that you want to track events on, replacing <YOUR_TRACKING_API_KEY_HERE> with your API key.
<script src="https://cdn.jsdelivr.net/npm/@getvero/tracking@latest/dist/index.window.js"></script>
<script>
    vero.tracker.init({
        trackingApiKey: "<YOUR_TRACKING_API_KEY_HERE>"
    })
</script>

Identify a user

When a user logs in, you should call the user.identify method. Both the id and email fields are required.
vero.tracker.user.identify({
    id: "<USER_ID_HERE>",
    email: "<USER_EMAIL_HERE>"
})
This will add or update a User to your Vero data store. You can also attach additional channels or add additional fields to the User profile:
vero.tracker.user.identify({
    id: "<USER_ID_HERE>",
    email: "<USER_EMAIL_HERE>",
    channels: [
        {
            type: "push",
            address: "<PUSH_TOKEN_HERE>",
            platform: "android"
        }
    ],
    data: {
        first_name: "<FIRST_NAME_HERE>",
        last_name: "<LAST_NAME_HERE>"
    }
})

Track an event

An Event represents a user action in your application. For instance, when a user takes a specific action or changes state.
vero.tracker.event.track({
    eventName: "viewed product",
    data: {
        product_name: "Red T-shirt",
        product_url: "https://www.example.com/products/red-t-shirt",
    }
})
You must call user.identify prior to calling event.track, unless you supply an identity object to the method. Once you call user.identify, the SDK will automatically identify the user and store the id and email in the browser’s local storage for future requests. You can also pass in an optional extras object as outlined in the Track REST API:
vero.tracker.event.track({
    eventName: "viewed product",
    data: {
        product_name: "Red T-shirt",
        product_url: "https://www.example.com/products/red-t-shirt",
    },
    extras: {
        source: "My application",
        createdAt: "2023-05-30T04:46:31+0000",
    }
})

Unidentify a user

If a user logs out, you should call the user.unidentify method so future events will not be accidentally associated with the user.
vero.tracker.user.unidentify()

Advanced usage

Alias/merge a user
vero.tracker.user.alias({
    newId: "<NEW_USER_ID_HERE>"
})
Add/remove tags
vero.tracker.tag.edit({
    add: ["<TAG_NAME_HERE>"],
    remove: ["<TAG_NAME_HERE>"]
})
Unsubscribe
vero.tracker.user.unsubscribe()
Resubscribe
vero.tracker.user.resubscribe()
Delete a user
vero.tracker.user.delete()

Ruby, PHP and others

Please refer to the respective SDK GitHub repositories (see SDKs above) for how-tos on using the Ruby, PHP and community-supported SDKs.

Legacy m.js JavaScript SDK

Prior to 2025, Vero had a legacy JavaScript SDK that was used to interact with the Vero Track API. We recommend using the JavaScript/TypeScript SDK instead, especially for new projects. However, the legacy m.js SDK is still available for use and will continue to be supported. m.js documentation Initialize the SDK Before you can use any of the functions available in the Vero JavaScript SDK, you must first initialize the SDK. To do so, place the following JavaScript on your website, typically in the <head> section of your HTML. We recommend including this on every page. Insert an active Vero API key. You can manage your API keys under Settings in your Vero Cloud account.
var _veroq = _veroq || [];
_veroq.push(["init", {api_key: "INSERT_API_KEY"}]);

(function () {
    var ve = document.createElement("script");
    ve.type = "text/javascript";
    ve.async = true;
    ve.src = "//d3qxef4rp70elm.cloudfront.net/m.js";
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(ve, s);
})();
Add or update a user When adding a User using the JavaScript SDK either an id or email value are required. All other attributes are optional and customizable. In this example we’re passing a value for the first_name, last_name and subscription properties.
_veroq.push([
    "user",
    {
        id: "123",
        email: "damienb@getvero.com",
        first_name: "Damien",
        last_name: "Brzoska",
        subscription: "medium",
    },
]);
Track an event An Event represents a user action in your application. For instance, when a user takes a specific action or changes state. When tracking an Event using the JavaScript library you do not need to pass an identity object as outlined in the Track REST API. Instead, you must make a call to the identify SDK method outlined above. A cookie is then stored and this identity is used by the SDK to form the full API request for you.
_veroq.push([
    "track",
    "viewed product",
    {
        product_name: "Red T-shirt",
        product_url: "http://www.yourdomain.com/products/red-t-shirt",
    },
]);
When tracking an Event, the JavaScript SDK supports passing the optional extras object as outlined in the Track REST API.
_veroq.push([
    "track",
    "viewed product",
    {
        product_name: "Red T-shirt",
        product_url: "http://www.yourdomain.com/products/red-t-shirt",
    },
    {
        source: "My application",
        created_at: "2024-08-01 10:05",
    },
]);
Alias/merge a user The alias method is used to merge two user identities, merging two sets of user data into one. This is an advanced method and may have unintended consequences. Please get in touch if you have questions regarding its usage
_veroq.push([
    'reidentify', {
        '456', // The new user ID
        '123'// The old user ID
    }]);
Add/remove tags Tags are one way to assign states or temporary attributes to users. Whilst tags are a first-class citizen in Vero we do eventually envision sunsetting them in favour of basic user attributes. For new use cases we encourage you to simply update a user attribute rather than use a tag.
_veroq.push([
    "tags",
    {
        id: "123",
        add: ["prospect"],
        remove: ["customer"],
    },
]);
Unsubscribe and resubscribe To unsubscribe or resubscribe a user, supply the User’s id. In this example, 123 is the id.
_veroq.push(["unsubscribe", "123"]);
_veroq.push(["resubscribe", "123"]);
Delete a user Users can’t be deleted via the JavaScript SDK at this time.