Get Started

Requirements

Your site's origin is registered in your Weei account. Register local and production origins separately.
The page is served over HTTPS (camera, microphone and screen sharing require it).

Minimal HTML example

Serve this file from a registered origin; a file:// URL will not work.

HTML

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Weei integration</title>
</head>
<body>
  <p id="weei-status" role="status">Loading Weei…</p>
  <script type="module">
    const status = document.querySelector('#weei-status');
    const loaderUrl = 'https://weei-core.web.app/loader.min.js';

    window.weeiReady = (async () => {
      const { loadWeei } = await import(loaderUrl + '?t=' + Date.now());
      const weei = await loadWeei();
      window.weei = weei;
      weei.setVisibility(true);
      return weei;
    })();

    window.weeiReady
      .then(() => (status.textContent = 'Weei is ready'))
      .catch(error => {
        status.textContent = 'Weei failed to load. Check the console.';
        console.error(error);
      });
  </script>
</body>
</html>

With a bundler

Keep the loader import out of the bundle. In Vite, mark it with @vite-ignore, and run it in the browser, not during server-side rendering.

JavaScript

const loaderUrl = 'https://weei-core.web.app/loader.min.js';

window.weeiReady ??= (async () => {
  const { loadWeei } = await import(/* @vite-ignore */ loaderUrl + '?t=' + Date.now());
  const weei = await loadWeei();
  window.weei = weei;
  weei.setVisibility(true);
  return weei;
})();

window.weeiReady.catch(error => console.error('Weei could not be loaded:', error));

The ?t= parameter avoids a cached failed loader. The ??= guard keeps a single client when the code runs again, for example on a route change.

Verify

Check	Expected result
`await window.weeiReady`	Resolves to the client.
The control panel	Appears, if your site settings allow it for this user.
A second browser tab on the same page	Both tabs see each other as participants.

Next steps

Identify your users with setUser(), open a built-in widget, or build your own.