Javascript SDK Troubleshooting

Content Security Policy (CSP)

You want to display Screeb surveys while being sure your app is secured and protected against injection attacks, here's how to make Screeb compatible with your Content Security Policy (CSP).

Your CSP should -at least- look like this:

default-src 'unsafe-inline' https://*.screeb.app wss://*.screeb.app

And don't forget to add your own domains.

An example:

content-security-policy: default-src https: 'unsafe-eval' 'unsafe-inline' https://*.screeb.app wss://*.screeb.app; object-src 'self'; report-uri /csp-violation-report; frame-ancestors 'self' https://admin.example.com https://vip.example.com

Check Javascript tag is loaded correctly

Open the developer console and call the following Screeb command: $screeb('debug');.

You will get contextual information about the running user session:

Error cases

• The error Uncaught ReferenceError: $screeb is not defined means the Javascript Tag was not injected into the page.
• An empty channel id means you didn't call the $screeb('init', ...) command.
• An empty respondent id means you exceeded your respondent quota.

Debug targeting rules

Since the targeting engine built by Screeb runs in the background, you may not understand which rules prevent your survey from being displayed to a user.

Open the developer console and call the following Screeb command: $screeb('targeting.debug');.

You will get a list of available surveys and the associated targeting rules:

The rules with a green dot 🟢 are the ones that have been validated for this user. The rules with a red dot 🔴 are not validated and maybe the reason why your survey is not displayed.

I paid for 100k MAU, but my application has 1m MAU

For large B2C applications, your Screeb quota may be consumed very fast. Until the end of the month, you will be able to survey only the first XXX MAU allowed by your quota.

In order to distribute your quota throughout the month, please use the following code:

function isScreebEnabledForCurrentUser(userId: string, country: string): boolean {
  // Screeb will be loaded for 100% of japan users
  if (country === "ja") {
    return true;
  }

  const hash = cyrb53Hash(userId, 42);

  // Screeb will be loaded for 10% of the rest of the audience.
  return hash % 10 === 0;
}

// https://stackoverflow.com/questions/7616461/generate-a-hash-from-string-in-javascript
function cyrb53Hash(str: string, seed: number): number {
  let h1 = 0xdeadbeef ^ seed,
    h2 = 0x41c6ce57 ^ seed;
  for (let i = 0, ch; i < str.length; i++) {
    ch = str.charCodeAt(i);
    h1 = Math.imul(h1 ^ ch, 2654435761);
    h2 = Math.imul(h2 ^ ch, 1597334677);
  }

  h1 =
    Math.imul(h1 ^ (h1 >>> 16), 2246822507) ^
    Math.imul(h2 ^ (h2 >>> 13), 3266489909);
  h2 =
    Math.imul(h2 ^ (h2 >>> 16), 2246822507) ^
    Math.imul(h1 ^ (h1 >>> 13), 3266489909);

  return 4294967296 * (2097151 & h2) + (h1 >>> 0);
}

Then for each call to a Screeb command, check that the user is enabled to load Screeb:

if (isScreebEnabledForUser("user-123",  'us')) {
  $screeb('init', ...)
}

if (isScreebEnabledForUser("user-123",  'us')) {
  $screeb('event.track', ...)
}

if (isScreebEnabledForUser("user-123",  'us')) {
  $screeb('identity.group.assign', ...)
}

To vary your audience every month, please update the seed parameter in cyrb53Hash. Eg: cyrb53Hash(userId, new Date().getMonth())