Wsparcie dla wielu widgetów — Wiele niezależnych instancji na stronie

Niektóre aplikacje potrzebują więcej niż jednego widgetu jednocześnie. Strony e-commerce z wieloma markami mogą wyświetlać widgety dla różnych kategorii produktów, a platformy wsparcia mogą uruchamiać oddzielne widgety dla sprzedaży i wsparcia technicznego. Wsparcie dla wielu widgetów jest teraz dostępne dzięki osadzaniu opartemu na instancjach i API per-instance.

Jak działa wsparcie dla wielu widgetów dzisiaj

• Ładuj skrypt widgetu więcej niż raz na tej samej stronie
• Nadaj każdemu skryptowi unikalny data-instance-id
• Użyj różnych wartości data-config-id dla każdej instancji, gdy to konieczne
• Każda instancja renderuje się w swoim własnym kontenerze (companin-widget-container-<instanceId> / companin-docs-widget-container-<instanceId>)

To pozwala na współistnienie wielu niezależnych widgetów na jednej stronie bez nadpisywania się nawzajem.

Zalecany wzór osadzania

Użyj unikalnych identyfikatorów skryptów i identyfikatorów instancji dla każdej instancji widgetu:

<script
  id="companin-widget-script-sales"
  src="https://widget.companin.tech/widget.js"
  data-client-id="..."
  data-agent-id="..."
  data-config-id="sales-config-id"
  data-instance-id="sales-widget"
></script>

<script
  id="companin-widget-script-support"
  src="https://widget.companin.tech/widget.js"
  data-client-id="..."
  data-agent-id="..."
  data-config-id="support-config-id"
  data-instance-id="support-widget"
></script>

Programatyczna kontrola per instancja

Użyj API rejestru, aby celować w konkretne instancje:

const sales = window.CompaninWidgets?.get('sales-widget');
const support = window.CompaninWidgets?.get('support-widget');

sales?.sendMessage('Pokaż aktualne oferty');
support?.sendMessage('Potrzebuję pomocy technicznej');

window.CompaninWidgets?.list();
window.CompaninWidgets?.destroy('support-widget');

Instancje widgetów dokumentów używają równoległego rejestru:

• window.CompaninDocsWidgets.get(id)
• window.CompaninDocsWidgets.list()
• window.CompaninDocsWidgets.destroy(id)

Kompatybilność wsteczna

Istniejące integracje nadal działają. window.CompaninWidget i window.CompaninDocsWidget nadal wskazują na ostatnio zainicjowaną instancję, podczas gdy API rejestru zapewniają deterministyczne celowanie w wiele instancji.

Praktyczne przypadki użycia

• Wsparcie specyficzne dla działu — oddzielne widgety dla sprzedaży, wsparcia technicznego, rozliczeń i zwrotów
• Interfejsy porównania produktów — zadawaj pytania o różne produkty równolegle
• Pulpity SaaS dla wielu najemców — osadzaj agentów per-najemca obok siebie
• Portale edukacyjne i szkoleniowe — odrębne widgety dla każdego kursu lub instruktora