SDK For Data Streaming

JavaScript

8min

Include the Javascript resource file with the following CDN reference link in the body tag and preferably in a global location such as your index.html or the global Javascript file. 
Please include ONE of  the following script reference and replace the placeholders with your API credentials. 
JS
<script src="https://sdk.qualetics.com/qualetics-js-sdk-v3.js"></script>
<script src="https://sdk.qualetics.com/qualetics-js-sdk-v3.js"></script>
﻿
Include Only ONE of the above script references.
Once the event tracking API is initialized, automatic Page level events are captured and streamed automatically without any additional code.
In the application that will be streaming the data, initialize the Qualetics API object using the following initialization script. 
Replace the placeholders APPLICATION_ID, APPLICATION_SECRET and CLIENT_ID with the API credentials provided to you or generated from the Qualetics portal. See Creating your account﻿ 
JS
<script>
var qualetics = new Qualetics.service("APPLICATION_ID", "APPLICATION_SECRET", "APPLICATION_PREFIX", PAGEVIEW_TRACKING, OPTIONS);  
qualetics.init()
</script>
<script>
var qualetics = new Qualetics.service("APPLICATION_ID", "APPLICATION_SECRET", "APPLICATION_PREFIX", PAGEVIEW_TRACKING, OPTIONS);  
qualetics.init()
</script>
﻿
Additional Options
The following options can be set while initiating the connection.
{
  host: string,
  port: number,
  defaultActor: Actor object,
  stickySessionId: boolean,
  storeDefaultActorFromApiCall: boolean,
  trackUserGeoLocation: boolean,
  trackPageVisibilityChanges: boolean,
  appVersion: string,
  disableErrorCapturing: boolean,
  captureClicks: boolean,
  captureTimings: boolean
}
host
String
Host that tracker will connect to 

Defaults to wss://api.qualetics.com
port
Number
Port that tracker will connect to 

Defaults to 443
defaultActor
Actor Object
Default actor for all the messages. 
This can be the actor information once logged in and will retain for all further automatic page view tracking. 
Custom events will still require an Actor object.
stickySessionId
Boolean
Store sessionId as cookie, 
If a stored sessionId has a different session prefix than what is configured, a new session id will be generated and it will be stored.

Defaults to true, only usable on browser. 
storeDefaultActorFromApiCall
Boolean
Store default actor from api call. This setting will have no effect if default actor setting is set.

Defaults to true, only usable on browser. 
trackUserGeoLocation
Boolean
Include users geolocation information as metadata.

This will prompt an alert to the user and  requires their approval to track locations.

Defaults to false, only usable on browsers. 
trackPageVisibilityChanges
Boolean
Track users page exits and returns automatically. 

Defaults to true
appVersion
String
Version number or the code of the application using the SDK

No Default value
disableErrorCapturing
Boolean
Automatically captures all JS and HTTP errors when using the JS SDK.

Defaults to false
captureClicks
Boolean
When true, all click events are automatically captured.

Defaults to false. 
captureTimings
Boolean
When true, the page load times are automatically captured.

Defaults to false.
Example Initialization Script
﻿
JS
<script>
var qualetics = new Qualetics.service("qualetics", "supersecretpassword", "app.qualetics.com", true, {host: "wss://api.qualetics.com", port: 443, appVersion: "1.0.1", trackUserGeoLocation: true, captureClicks: true, captureTimings: true});  
qualetics.init()
</script>
<script>
var qualetics = new Qualetics.service("qualetics", "supersecretpassword", "app.qualetics.com", true, {host: "wss://api.qualetics.com", port: 443, appVersion: "1.0.1", trackUserGeoLocation: true, captureClicks: true, captureTimings: true});  
qualetics.init()
</script>
﻿
Custom Event Creation
In addition to automatic tracking, Qualetics API allows you to track custom events from your application enabling you to gather data for specific events. 
Examples of such events are - 
A user performing a Login action in your application 
Adding a Product to the cart 
Completing a Purchase
Adding a Product Review
Performing a Search for a specific item
Such events can contain valuable data that can aid to understanding your application and also help with additional data collection. Following is an example of how such events can be captured using the entities of Actor, Action, Context and Object.
JS
var eventObj = {
"actor": {
    	"type": "User", 
    	"id": "js1234",
    	"attributes": {"name": "John Doe"}
},
"action": { 
           "Name": "Buy Product",
           "attributes": {"referrer": "Facebook", "coupon": "KIHSK123FS"}
},
"context": { 
            "type": "Product Promotion",
    	    "name": "Superbowl Sales",
    	    "attributes": {"discount": "Half-Off"}
},
"object": {"type": "Television",
            "name": "Samsung",
            "attributes":{"Model": "XYZ123", "Item price":"$1299", "Screen": "60 Inches"}
}};
var eventObj = {
"actor": {
    	"type": "User", 
    	"id": "js1234",
    	"attributes": {"name": "John Doe"}
},
"action": { 
           "Name": "Buy Product",
           "attributes": {"referrer": "Facebook", "coupon": "KIHSK123FS"}
},
"context": { 
            "type": "Product Promotion",
    	    "name": "Superbowl Sales",
    	    "attributes": {"discount": "Half-Off"}
},
"object": {"type": "Television",
            "name": "Samsung",
            "attributes":{"Model": "XYZ123", "Item price":"$1299", "Screen": "60 Inches"}
}};
﻿
Sending Events
The Event can be sent either by sending the complete JSON object
JS
qualetics.send(eventObj);
qualetics.send(eventObj);
﻿
OR 
Using the builder message builder
JS
let message = qualetics.createMessage();
    message.setAction({
      type: "ButtonClick"
    }).setActor({
      type: "User", 
      id: "js1234",
      attributes: {name: "John Doe"}
    }).setAction({
      name: "Buy Product",
      attributes: {"referrer": "Facebook", "coupon": "KIHSK123FS"}
    }).setContext({
      type: "Product Promotion",
      name: "Superbowl Sales",
      attributes: {"discount": "Half-Off"}
    }).setObject({
      type: "Television",
      name: "Samsung",
      attributes:{"Model": "XYZ123", "Item price":"$1299", "Screen": "60 Inches"}
    }).send();
let message = qualetics.createMessage();
    message.setAction({
      type: "ButtonClick"
    }).setActor({
      type: "User", 
      id: "js1234",
      attributes: {name: "John Doe"}
    }).setAction({
      name: "Buy Product",
      attributes: {"referrer": "Facebook", "coupon": "KIHSK123FS"}
    }).setContext({
      type: "Product Promotion",
      name: "Superbowl Sales",
      attributes: {"discount": "Half-Off"}
    }).setObject({
      type: "Television",
      name: "Samsung",
      attributes:{"Model": "XYZ123", "Item price":"$1299", "Screen": "60 Inches"}
    }).send();
﻿
All Automatic and Custom Events will be processed and available as insights in the Portal created.

host	String	Host that tracker will connect to Defaults to wss://api.qualetics.com
port	Number	Port that tracker will connect to Defaults to 443
defaultActor	Actor Object	Default actor for all the messages. This can be the actor information once logged in and will retain for all further automatic page view tracking. Custom events will still require an Actor object.
stickySessionId	Boolean	Store sessionId as cookie, If a stored sessionId has a different session prefix than what is configured, a new session id will be generated and it will be stored. Defaults to true, only usable on browser.
storeDefaultActorFromApiCall	Boolean	Store default actor from api call. This setting will have no effect if default actor setting is set. Defaults to true, only usable on browser.
trackUserGeoLocation	Boolean	Include users geolocation information as metadata. This will prompt an alert to the user and requires their approval to track locations. Defaults to false, only usable on browsers.
trackPageVisibilityChanges	Boolean	Track users page exits and returns automatically. Defaults to true
appVersion	String	Version number or the code of the application using the SDK No Default value
disableErrorCapturing	Boolean	Automatically captures all JS and HTTP errors when using the JS SDK. Defaults to false
captureClicks	Boolean	When true, all click events are automatically captured. Defaults to false.
captureTimings	Boolean	When true, the page load times are automatically captured. Defaults to false.

Updated 11 Dec 2023

Did this page help you?

SDK For Data Streaming

Angular