Naar de inhoud
Mikabot

Werking van de widget

Deze pagina beschrijft wat de widget in de browser doet nadat je de code hebt geplakt. Gebruik hem om de widget vanuit je eigen code aan te sturen, een laadprobleem te onderzoeken of vragen in een securityreview te beantwoorden.

Configuratieobject

De code zet window.MIKADO_CHATBOT_CONFIG voordat de loader draait.

  • domain (verplicht) — de Mikabot-app-URL waar de widget vandaan laadt en die hij aanroept. Al ingevuld in je code.
  • store_id (verplicht) — je chatbotsleutel, met voorvoegsel st_. Gaat mee met elk verzoek.
  • language (optioneel) — forceert een taal. Laat weg voor automatische detectie.
  • container (optioneel) — toont de chat in een element op je pagina in plaats van als zwevende bubbel.
  • debugLogging (optioneel) — zet op true om de interne stappen van de widget in de console te zien tijdens het onderzoeken van een probleem.

Laadvolgorde

  1. Je pagina laadt en definieert MIKADO_CHATBOT_CONFIG.
  2. mikabot-init.js wacht op het load-event van het venster en laadt dan het hoofdscript vanaf het ingestelde domain. Er wordt niets opgehaald voordat je eigen pagina klaar is.
  3. Het hoofdscript voegt de stylesheet van de widget toe vanaf datzelfde domein, en een stylesheet met iconen vanaf cdnjs.cloudflare.com.
  4. De sitegegevens en je geschreven antwoorden worden opgehaald in de gedetecteerde taal.
  5. De bubbel, of je container, wordt getoond.

Taaldetectie

De eerste treffer wint:

  1. language in MIKADO_CHATBOT_CONFIG
  2. Het lang-attribuut op <html>
  3. De browsertaal, via navigator.language
  4. Engels

Ondersteunde waarden zijn en, nl, fr, de, es en it. Iets anders wordt genegeerd en de detectie gaat door naar de volgende stap.

Wat de widget beschikbaar maakt

Na initialisatie zijn deze globals beschikbaar:

  • window.chatbot — de instantie van de widget, handig in de console om de status te bekijken
  • window.trackProductClick(externalId, clickType, event) — registreert een klik op een product dat je zelf toont
  • window.askAboutProduct(productId, productTitle, externalId) — opent de chat met een vraag over een specifiek product

Roep ze aan vanuit een actie van de bezoeker, bijvoorbeeld een knop in je eigen productkaart, en niet vanuit een script dat draait voordat de widget bestaat.

Wat er in de browser wordt opgeslagen

De widget gebruikt localStorage, geen cookies:

  • mikabot_session_id — de sessie die de berichten van een bezoeker tot één gesprek bundelt
  • mikado_chat_messages — het zichtbare gesprek, zodat het een herlaadbeurt overleeft. Het wordt na 24 uur gewist.
  • chatbot-language — de taal die de bezoeker het laatst gebruikte

Een nieuw gesprek starten wist deze waarden.

Hostingvereisten

  • De widget moet je Mikabot-domain kunnen bereiken voor scripts, stijlen en API-aanroepen.
  • Met een Content-Security-Policy sta je die host toe in script-src, style-src en connect-src, en cdnjs.cloudflare.com in style-src en font-src.
  • De hostnaam van de pagina moet overeenkomen met het veld Domain van de chatbot. Een verschil is de meest voorkomende oorzaak van een widget die wel laadt maar nooit antwoordt.

Lees verder