​
Prerequisites

​
Invisible iframe

This is a very lightweight integration that simply requires you to include an iframe component in the body of the page you want to run the data collection. This is shown below. There are two options you need to be aware of.

  • projectId - This is the project id you have been given by Innerworks.

  • detectionType - This outlines the kind of detection, either vpn, fingerprint, or bot.

<iframe id="iframe" src="https://sdk.prod.innerworks.me?projectId=${your-project-id}&mode=${detectionType}" style="display: none;"></iframe>

​
Callback

Since the data collection runs in the background of a page, you must ensure that the iframe remains open while data is being collected. For a home page or dashboard page this is not an issue, but for a short-lived page such as a loading page or a splashscreen you may want to ensure that it only closes once the Innerworks data collection has completed. To do this, we provide a callback function:

function iframeCallback() {
  // Include logic here to indicate the page is now free to be
  // destroyed. We also recommend including a timeout in case the
  // callback fails to be sent for some reason or takes too long.
}

window.addEventListener("message", (event) => {
    const result = event.data;

    if (
        result 
        && result.source === "innerworks"
        && typeof result.success === "boolean"
    ) {
        if(result.success) {
          iframeCallback();
        } else {
          // handle failed request
        }    
    }
});

Remember to include the code in your page.

<script src="callback.js"></script>