Web SDK integration guide

The Adjust Web SDK enables you to record attribution, events, and more in your web app. This guide shows you how to integrate the Adjust SDK with your app.

1. Add the SDK to your project

To get started, you need to add the SDK to your web app. The Adjust SDK works in both CommonJS and AMD (Asynchronous Module Definition) environments and can be accessed through a global Adjust namespace when loaded through a CDN (Content Delivery Network).

Using a CDN

When loading the SDK through a CDN, you should use a minified version in your production build. You can specify a version by adding it to the CDN target like this: https://cdn.adjust.com/adjust-5.6.0.min.js. You can get the latest version by targeting the adjust-latest package like this: https://cdn.adjust.com/adjust-latest.min.js. This package updates automatically so you don’t need to change the target file.

To load the SDK through a CDN, add the following snippet between your web app’s <head> tags:

<script type="application/javascript">
   !(function (t, e, a, r, n, s, d, l, o, i, u) {
      (t.Adjust = t.Adjust || {}), (t.Adjust_q = t.Adjust_q || []);
      for (var c = 0; c < l.length; c++) o(t.Adjust, t.Adjust_q, l[c]);
      (i = e.createElement(a)),
         (u = e.getElementsByTagName(a)[0]),
         (i.async = !0),
         (i.src = "https://cdn.adjust.com/adjust-latest.min.js"),
         (i.onload = function () {
            for (var e = 0; e < t.Adjust_q.length; e++)
               t.Adjust[t.Adjust_q[e][0]].apply(t.Adjust, t.Adjust_q[e][1]);
            t.Adjust_q = [];
         }),
         u.parentNode.insertBefore(i, u);
   })(
      window,
      document,
      "script",
      0,
      0,
      0,
      0,
      [
         "initSdk",
         "getAttribution",
         "getWebUUID",
         "setReferrer",
         "trackEvent",
         "addGlobalCallbackParameters",
         "addGlobalPartnerParameters",
         "removeGlobalCallbackParameter",
         "removeGlobalPartnerParameter",
         "clearGlobalCallbackParameters",
         "clearGlobalPartnerParameters",
         "switchToOfflineMode",
         "switchBackToOnlineMode",
         "stop",
         "restart",
         "gdprForgetMe",
         "disableThirdPartySharing",
         "initSmartBanner",
         "showSmartBanner",
         "hideSmartBanner",
      ],
      function (t, e, a) {
         t[a] = function () {
            e.push([a, arguments]);
         };
      },
   );
</script>

The Adjust SDK loads on each page and initiates once per page load.

Subresource Integrity

If you want to use Subresource Integrity checks to mitigate against XSS (Cross-Site Scripting) attacks, you can validate the package before running it by using the following call:

<script type="application/javascript">
   !(function (t, e, a, r, n, s, o, d, l, i, u) {
      (t.Adjust = t.Adjust || {}), (t.Adjust_q = t.Adjust_q || []);
      for (var c = 0; c < d.length; c++) l(t.Adjust, t.Adjust_q, d[c]);
      (i = e.createElement(a)),
         (u = e.getElementsByTagName(a)[0]),
         (i.async = !0),
         (i.src = "https://cdn.adjust.com/adjust-latest.min.js"),
         (i.crossOrigin = "anonymous"),
         (i.integrity = s),
         (i.onload = function () {
            for (var e = 0; e < t.Adjust_q.length; e++)
               t.Adjust[t.Adjust_q[e][0]].apply(t.Adjust, t.Adjust_q[e][1]);
            t.Adjust_q = [];
         }),
         u.parentNode.insertBefore(i, u);
   })(
      window,
      document,
      "script",
      0,
      0,
      "sha384-BqbTn9xyk5DPznti1ZP8ksxKiOFhKufLBFWm5eNMCnZABFSG1eqQfcu5dsiZJHu5",
      0,
      [
         "initSdk",
         "getAttribution",
         "getWebUUID",
         "setReferrer",
         "trackEvent",
         "addGlobalCallbackParameters",
         "addGlobalPartnerParameters",
         "removeGlobalCallbackParameter",
         "removeGlobalPartnerParameter",
         "clearGlobalCallbackParameters",
         "clearGlobalPartnerParameters",
         "switchToOfflineMode",
         "switchBackToOnlineMode",
         "stop",
         "restart",
         "gdprForgetMe",
         "disableThirdPartySharing",
         "initSmartBanner",
         "showSmartBanner",
         "hideSmartBanner",
      ],
      function (t, e, a) {
         t[a] = function () {
            e.push([a, arguments]);
         };
      },
   );
</script>

Using npm

The Adjust SDK is also available on npm. To add the package to your project, use your preferred package manager:

2. Initialize the SDK

Once you’ve installed the SDK, you need to initialize it. To do this, call the initSdk method. This method takes a number of arguments that customize how the SDK works in your app.

You must add the following arguments to your initSdk call to initialize the SDK:

appToken (string): Your Adjust app token.
environment (string): The environment you want to run the SDK in. Pass sandbox to run the SDK in sandbox mode for testing. Pass production to run the SDK in production mode for release.

Adjust.initSdk({
   appToken: "YOUR_APP_TOKEN",
   environment: "sandbox",
});