module-pixel

Pixel module injects HTML into a browser page through effects. Script execution is an explicit application capability and is disabled by default.

Installation#

Install with npm in your application:

$ npm install --save \
    @eventvisor/sdk \
    @eventvisor/module-pixel

Setting up#

And then set it up when initializing the SDK:

import { createEventvisor } from "@eventvisor/sdk";
import { createPixelModule } from "@eventvisor/module-pixel";
const eventvisor = createEventvisor({
  modules: [
    createPixelModule({
      allowScripts: true,
      nonce: () => window.__cspNonce,
    }),
  ]
});

Leave allowScripts disabled when only markup such as tracking images is needed. When scripts are disabled, script elements are ignored and a diagnostic is reported. When enabled, use a restrictive Content Security Policy and supply a nonce from trusted application code. See Security.

Usage example#

In your effect definition:

# ...
steps:
  - handler: pixel
    params:
      snippet: |
        <script>
          console.log("Hello world!");
        </script>
      selector: body

Variables#

You can make use of sources in pixel's snippet as variables:

<script>
  console.log("Hello world from {{ payload.url }}");
</script>