Frontend IntegrationWeb ObjectSophi Web Object (@usesophi/sophi-web-object)

Sophi Web Object (@usesophi/sophi-web-object)

The Sophi Web Object package is a framework-agnostic browser SDK that tracks e-commerce behaviour via window.sophi_object and sends structured events to the Sophi event API.

The Sophi Web Object package is a framework-agnostic browser SDK that tracks e-commerce behaviour and sends structured events to the Sophi event API. It is separate from the Sophi Web SDK, which embeds the conversational assistant widget (SophiWidget).

PackagePurpose
@usesophi/sophi-web-objectData layer on window.sophi_object, automatic sends when tracked fields change, and window.SophiTracker for SPAs
@usesophi/sophi-web-sdkWidget UI, commerce events from the assistant, runtime methods on SophiWidget

Use Web Object when you need server-style tracking (page, product, basket, purchase, etc.) without depending on the widget bundle.

Chat widget vs Web Object

If you are loading the assistant widget from GTM, follow SDK GTM integration (@usesophi/sophi-web-sdk).
For commerce / analytics tracking with window.sophi_object, use GTM integration (@usesophi/sophi-web-object).

Start here

  • GTM integration — Google Tag Manager setup (recommended for teams that want easy version upgrades via tag publishing).
  • Integration guide — Compare GTM, script tag, and npm; best practices and a short events cheat sheet.
  • Installation — CDN URLs and package artifacts.

How it works (high level)

  1. You define window.sophi_object with a config block (at minimum apiKey) and optional context objects before the script runs, or you update them after load via assignments or SophiTracker.push().
  2. On DOMContentLoaded, the SDK starts: validates config, creates or restores a client session (cookies and server handshake), then watches window.sophi_object for changes to tracked fields.
  3. Assignments to tracked keys (page, user, product, basket, listing, transaction) build event payloads and add them to an outbound queue.
  4. The queue debounces sends (default 300 ms), retries on failure, and tries to flush remaining items when the visitor leaves the page.

Events are delivered to Sophi over HTTPS (see Configuration for the options you control).

Reference

TopicLink
Configurationconfiguration.md
window.sophi_object layerwindow-object.md
SophiTracker APIsophi-tracker.md
Event typesevent-types.md
Types referencetypes.md
Data and auth flowsflows.md
Validationvalidation.md
Integration patternsintegration-patterns.md

Builds

The package publishes:

ArtifactFormat
dist/sophi.jsIIFE (window.SophiTracker)
dist/sophi.min.jsMinified IIFE
dist/sophi.esm.jsES module

See Installation for CDN URLs and Integration guide for how to load each variant.

On this page