🛍️ Customer Website · Integration Example

Recommended No-code integration: data-* attributes

Use one <script> tag without writing any JS:

<script src="http://localhost:18080/sdk/leke-chat.umd.js" data-site-key="demo-site-key" async></script>

For more optional fields (username / phone / email / widget title / display language / skill group, etc.), see Initialization parameters below and use the matching data-* column.

Declarative config: window.AiKeChatConfig

Use this when you need to pass complex structures such as user.extra:

<script>
  window.AiKeChatConfig = {
    siteKey: 'demo-site-key',
    user: {
      externalUserId: 'biz-uid-12345',
      extra: { vipLevel: 'gold' }
    }
  };
</script>
<script src="http://localhost:18080/sdk/leke-chat.umd.js"></script>

Define the config before the SDK script. data-* and AiKeChatConfig can be used together; data-* overrides fields with the same name.

Programmatic API: AiKeChat.init()

Use this for dynamic configuration or on-demand mounting in an SPA:

<script src="http://localhost:18080/sdk/leke-chat.umd.js" data-auto-init="false"></script>
<script>
  AiKeChat.init({
    siteKey: 'demo-site-key',
    user: { externalUserId: 'biz-uid-12345', username: 'John Doe' },
    title: 'Customer Support'
  });
</script>

When the SDK starts, it calls /v1/visitor/auth to exchange the siteKey for a JWT, and all subsequent WebSocket connections include that JWT. user.deviceFp automatically falls back to localStorage, so returning visitors can be merged.

Verified message flow

1. Page loads → SDK fetches /v1/visitor/auth {siteKey, user}
2. biz-api validates the siteKey and domain allowlist → merges the customer → issues a JWT
3. SDK connects to the im-gateway WebSocket with ?token=<JWT>
4. im-gateway verifies the signature → extracts tenantId / customerId → registers them in the hub
5. Send a message → NATS → persist-worker writes to the database → echo-agent replies → the widget displays it

Initialization parameters

The following fields support all three input methods: data-* attributes (recommended) / window.AiKeChatConfig / AiKeChat.init().

Bundle size

• leke-chat.umd.js: ~14 KB (gzip ~5 KB)
• leke-chat.mjs: ~18 KB (gzip ~6 KB)
• leke-chat.d.ts: TypeScript types