DTVR Browser SDK

Engineering Portal / Digital / Digital in TV Ratings / DTVR Browser SDK

Prerequisites

To start using the App SDK, the following details are required:

• App ID (apid): Unique ID assigned to the player/site and configured by product.
• sfcode: Location of collection environment. Please set the sfcode to “dcr“.

If you do not have any of these pre-requisites or if you have any questions, please contact our SDK sales support team.

Configure SDK

There are two steps required for configuring your SDK: 1. Add Static Queue Snippet and 2. Create SDK Instance.

Add Static Queue Snippet

Add the following script tag to your website:

<script>
    ! function(t, n) {
        t[n] = t[n] || {
            nlsQ: function(e, o, c, r, s, i) {
                return s = t.document,
                    r = s.createElement("script"),
                    r.async = 1,
                    r.src = ("http:" === t.location.protocol ? "http:" : "https:") + "//cdn-gl.imrworldwide.com/conf/" + e + ".js#name=" + o + "&ns=" + n,
                    i = s.getElementsByTagName("script")[0],
                    i.parentNode.insertBefore(r, i),
                    t[n][o] = t[n][o] || {
                        g: c || {},
                        ggPM: function(e, c, r, s, i) {
                            (t[n][o].q = t[n][o].q || []).push([e, c, r, s, i])
                        }
                    }, t[n][o]
            }
        }
    }
    (window, "NOLBUNDLE");
</script>

The static queue snippet allows the SDK APIs to be called while the actual SDK and configuration file are still being downloaded. Since the queue is able to capture all API calls before the download completes, there is no wait time. Once the SDK is available, the API calls will transition from directing to the queue to the SDK seamlessly.

Create SDK Instance

To initialize the SDK, you will need to create an SDK instance by making the initialization call:

NOLBUNDLE.nlsQ("<apid>", "<instanceName>",{nol_sdkDebug: "debug"})

When creating your instance, you will need to pass three parameter values. The available parameters are listed in the table below:

Parameters	Description	Value	Required? (Y/N)
apid	UniqueID assigned to player/site.	"XXXXXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXX"	Yes
instanceName	User-defined string value for describing the player/site.	Client specified	Yes
sfcode	Location of collection environment. All traffic should be directed to "dcr".	Yes
nol_sdkDebug:"debug"	Enables Debug Mode which allows output to be viewed in console.	"{nol_sdkDebug: "debug"}"	No

Example SDK Initialization

var nSdkInstance = NOLBUNDLE.nlsQ("XXXXXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXX", "nlsnInstance", {nol_sdkDebug: "debug"});

When the initialization call is made, a unique static configuration file, <apid>.js, will be downloaded based on your apid and cached on the user's browser.

Once the configuration is downloaded, the SDK itself will be downloaded and initialized. All SDK modules are included in one file: "nlsSDK600.bundle.min.js".

Example SDK Initialization

Your configuration should include the Static Queue Snippet and an SDK Instance for your unique App ID as shown in the example:

//Add Static Queue Snippet
<script>
    ! function(t, n) {
        t[n] = t[n] || {
            nlsQ: function(e, o, c, r, s, i) {
                return s = t.document,
                    r = s.createElement("script"),
                    r.async = 1,
                    r.src = ("http:" === t.location.protocol ? "http:" : "https:") + "//cdn-gl.imrworldwide.com/conf/" + e + ".js#name=" + o + "&ns=" + n,
                    i = s.getElementsByTagName("script")[0],
                    i.parentNode.insertBefore(r, i),
                    t[n][o] = t[n][o] || {
                        g: c || {},
                        ggPM: function(e, c, r, s, i) {
                            (t[n][o].q = t[n][o].q || []).push([e, c, r, s, i])
                        }
                    }, t[n][o]
            }
        }
    }
    (window, "NOLBUNDLE");

//Create SDK Instance
var nSdkInstance = NOLBUNDLE.nlsQ("XXXXXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXX", "nlsnInstance", {nol_sdkDebug: "debug"});
</script>

Configure and fire API calls

The syntax for firing events is

    nSdkInstance.ggPM("event", parameter object);

Event is passed in parameter 1 and the argument is passed in parameter 2.

Configure API calls - loadMetadata

Use loadMetadata (Browser) to pass the metadata object. The data must be passed as a JSON string.

    this.onMeta(function(data, player) {nSdkInstance.ggPM("loadMetadata", metadataObject) });

Below is a sample metadata object.

    var metadataObject =
    {
        channelName: "WXYZ",
        type: "content",
        adModel: "1"
    }

Configure API calls - sendID3

Use sendID3 (Browser) to send ID3 payload of HLS content being played, as and when an ID3 packet is received (approximately, once in every 10 seconds).

    this.onTimedMetadata(function(args) {nSdkInstance.ggPM("sendID3", ID3_Object) });

ID3_Object is the container to pass the retrieved ID3 tag from the streaming. The player should look for 'PRIV' ID3 tags and send 'owner' field (which typically starts from "www.nielsen.com") through this API. Refer to Browser SDK API Reference - Retrieving ID3 Tags for more information.

Sample ID3 tags

• www.nielsen.com/X100zdCIGeIlgZnkYj6UvQ==/X100zdCIGeIlgZnkYj6UvQ==/AAAB2Jz2_k74GXSzx4npHuI_JwJd3QSUpW30rDkGTcbHEzIMWleCzM-uvNOP9fzJcQMWQLJqzXMCAxParOb5sGijSV9dNM3QiBniJYGZ5GI-lL1fXTTN0IgZ4iWBmeRiPpS9AAAAAAAAAAAAAAAAAAAAAFJWFM5SVhTONNU=/00000/00000/00
• www.nielsen.com/X100zdCIGeIlgZnkYj6UvQ==/R8WHe7pEBeqBhu8jTeXydg==/AAICoyitYqlxT7n6aZ0oMCGheFi4CXFp46AMUPZz1lMr_M9tr3_cjee1SHqxrOiVerMDLeyn9xzocZSKwi746Re8vNOtpNCAZjYABs_J0R25IHpvOc1HS8QHGgD5TgOJeS6gX100zdCIGeIlgZnkYj6UvVJWFNhSVhTiPE0=/00000/46016/00

Note: ID3 tags are not applicable for International (Germany)

Refer to Browser SDK API Reference - Retrieving ID3 Tags section to know more details.

Configure API calls - end

Call end (Browser) only at the end of playback. Call play (Browser) when resuming the stream / starting the new stream.

If you are viewing Live content, you do not need to use the end call.

Nielsen Measurement Opt-Out Implementation

• As a global information and measurement leader, we are committed to protecting the privacy and security of the data we collect, process and use. Our digital measurement products are not used to identify the consumer in any way, but they help us and our clients measure and analyze how consumers engage with media across online, mobile and emerging technologies, and offer insights into consumer behavior.
• When the user wants to opt in or opt out of Nielsen measurement, a new dynamic page (with content similar to [1]) should be displayed.
• For more details, refer to Browser SDK API Reference - Browser Opt-Out Implementation and Nielsen Digital Privacy.
  • Use getOptOutStatus (Browser) to retrieve the device’s Opt-Out status.

Testing an Implementation - App

See Digital Measurement Testing.