Back to Documentation

Webchat Embed Quickstart

Embed and configure ReplyBase webchat on your site

1) Add the embed script

<script
  src="https://YOUR_REPLYBASE_DOMAIN/embed/replybase-webchat.js"
  data-base-url="https://YOUR_REPLYBASE_DOMAIN"
  data-public-key="YOUR_WEBCHAT_PUBLIC_KEY"
  data-title="Chat with ReplyBase"
  data-primary-color="#0f766e"
  data-position="right"
  data-mobile-mode="auto"
  data-telemetry="all"
  defer
></script>

Use one targeting option:

  • Preferred: data-public-key
  • Fallback: data-channel-id
  • Fallback: data-bot-id

Optional runtime controls

  • data-mobile-mode="auto|fullscreen|windowed"
  • data-telemetry="all|essential|off"
  • data-telemetry-events="OPEN,CLOSE,ERROR"
  • data-cookie-consent="off|required"
  • data-cookie-consent-check="ReplyBaseWebchatConsent.hasConsent"
  • data-cookie-consent-event="replybase:webchat-consent-updated"

2) API routes used by widget

  • POST /api/webchat/init
  • GET /api/webchat/config
  • POST /api/webchat/message
  • POST /api/webchat/events

3) Connect Flow Builder to Webchat

  1. Create or edit a flow in Dashboard: /flows
  2. Add your step sequence (message, input, condition, action, end)
  3. Set the bot entry flow in bot settings
  4. Open /integrations/webchat and pick the same bot + web channel
  5. Save config, then launch the internal test widget harness
  6. Publish the embed snippet on your website

Runtime behavior is flow-first. If no flow response is produced, the system falls back to AI responses for continuity.

4) CORS allowlist (optional)

WEBCHAT_ALLOWED_ORIGINS=https://example.com,https://www.example.com

Site-level allowlists are managed per webchat channel in Dashboard and are enforced in init, config, message, and events APIs.

5) Session token secret

  • WEBCHAT_TOKEN_SECRET
  • AUTH_SECRET (fallback)

6) Rate limiting knobs (optional)

WEBCHAT_RATE_LIMIT_INIT_IP=20
WEBCHAT_RATE_LIMIT_INIT_WINDOW_MS=60000
WEBCHAT_RATE_LIMIT_MESSAGE_IP=120
WEBCHAT_RATE_LIMIT_MESSAGE_WINDOW_MS=60000
WEBCHAT_RATE_LIMIT_MESSAGE_SESSION=60
WEBCHAT_RATE_LIMIT_MESSAGE_SESSION_WINDOW_MS=60000
WEBCHAT_RATE_LIMIT_EVENTS_IP=240
WEBCHAT_RATE_LIMIT_EVENTS_WINDOW_MS=60000
WEBCHAT_RATE_LIMIT_EVENTS_SESSION=180
WEBCHAT_RATE_LIMIT_EVENTS_SESSION_WINDOW_MS=60000

7) Troubleshooting: Origin Not Allowed

  • Confirm you are testing from an allowed origin.
  • In /integrations/webchat, use Add Current Origin and Save Config.
  • Launch Test Widget from dashboard to use the internal harness page.
  • Check Diagnostics for blocked-origin events and exact timestamps.

8) One-time data normalization

pnpm run normalize:web-channel-type