JS API-integration

Komplett referens for FlowHunt JS API v2-integration. Badda in chatboten, prenumerera pa alla 11 handelser, anvand flodesvariabler, utlos Chat Hook-trigger mitt i konversationen med sendHook(), spara interaktioner med URL-parametrar och styr chattfonstret programmatiskt.

FlowHunt JavaScript API Chatbot Integration

FlowHunt JS API ger dig full kontroll over hur din chatbot integreras med din webbplats. Med v2-integrationskoden kan du badda in chatboten, prenumerera pa livscykel- och interaktionshendelser, skicka dynamisk data via flodesvariabler, utlosa Chat Hook-triggern mitt i konversationen med sendHook(), spara interaktioner med URL-parametrar och programmatiskt styra chattfonstret.

Denna guide tacker alla aspekter av JS API med kodexempel som du kan kopiera och anpassa till ditt projekt.

Integrationskod (v2)

Kopiera och klistra in fragmentet nedan i din HTML strax fore den avslutande </body>-taggen. Ersatt YOUR_CHATBOT_ID och YOUR_WORKSPACE_ID med vardena fran dina FlowHunt-chatbotinstellningar.

<script id="fh-chatbot-script-YOUR_CHATBOT_ID">
  var currentScript = document.currentScript
    || document.getElementById('fh-chatbot-script-YOUR_CHATBOT_ID');

  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://app.flowhunt.io/api/chatbot/YOUR_CHATBOT_ID'
    + '?workspace_id=YOUR_WORKSPACE_ID&v=2';

  script.onload = function () {
    window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
      // The chatbot is ready — use chatbotManager here
    });
  };

  if (currentScript && currentScript.parentNode) {
    currentScript.parentNode.insertBefore(script, currentScript.nextSibling);
  } else {
    document.head.appendChild(script);
  }
</script>

Chatbot-ID:t i det globala variabelnamnet (window.FHChatbot_YOUR_CHATBOT_ID) anvander understreck istallet for bindestreck.

Overskriva konfiguration med setConfig()

Fore anrop av init() kan du overskriva standardinstellningarna for chatboten med setConfig():

<script id="fh-chatbot-script-YOUR_CHATBOT_ID">
  var currentScript = document.currentScript
    || document.getElementById('fh-chatbot-script-YOUR_CHATBOT_ID');

  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://app.flowhunt.io/api/chatbot/YOUR_CHATBOT_ID'
    + '?workspace_id=YOUR_WORKSPACE_ID&v=2';

  script.onload = function () {
    window.FHChatbot_YOUR_CHATBOT_ID.setConfig({
      headerTitle: 'Support Assistant',
      maxWindowWidth: '700px',
      showChatButton: false,
      flowVariables: {
        userId: '12345',
        plan: 'enterprise',
      },
      urlSuffix: '?utm_source=chatbot',
    });

    window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
      // Chatbot initialised with custom config
    });
  };

  if (currentScript && currentScript.parentNode) {
    currentScript.parentNode.insertBefore(script, currentScript.nextSibling);
  } else {
    document.head.appendChild(script);
  }
</script>

Tillgangliga konfigurationsalternativ

AlternativTypBeskrivning
headerTitlestringAnpassad rubriktext
maxWindowWidthstringMaximal bredd pa chattfonstret (t.ex. "700px")
maxWindowHeightstringMaximal hojd pa chattfonstret
inputPlaceholderstringPlatshallartext for meddelandeinmatningsfaltet
showChatButtonbooleanVisa eller dolj den flytande standardchattknappen
openChatPanelbooleanOppna chattpanelen automatiskt vid sidladdning
flowVariablesobjectNyckel-varde-par med anpassad data som skickas till flodet. Varden far vara av valfri JSON-serialiserbar typ (string, number, boolean, object, array).
urlSuffixstringFragesrang som laggs till alla chatbot-genererade URL:er
cookieConsentbooleanAktivera sessionsbestandighet via cookies
embeddedstringStall in for att aktivera inbaddat lage (ingen stangknapp)
themestringTemalage

Flodesvariabler: skicka dynamisk data

flowVariables sammanfogas till varje session som chatboten skapar. De anvands vanligtvis som statisk kontext (kand vid sidladdning): anvandarens ID, plan, aktuell lokal osv.

window.FHChatbot_YOUR_CHATBOT_ID.setConfig({
  flowVariables: {
    userId: getCurrentUserId(),
    userEmail: getCurrentUserEmail(),
    currentPage: window.location.pathname,
    plan: 'enterprise',
  },
});

Om anvandaren navigerar efter att chatten har oppnats blir varden som skickats har inaktuella. For att uppdatera dem mitt i konversationen, anropa chatbotManager.sendHook() med options.flowVariables — se Vardpaginas → flodes-kommunikation mitt i konversationen nedan.

URL-suffix: spara chatbotinteraktioner

Parametern urlSuffix lagger till en fragesrang till varje URL som genereras av chatboten. Detta ar anvandbart for att spara chatbotgenererad trafik i analysverktyg:

window.FHChatbot_YOUR_CHATBOT_ID.setConfig({
  urlSuffix: '?utm_source=chatbot&utm_medium=widget',
});

Anvandningsomraden:

  • Spara konverteringar fran chatbotinteraktioner i Google Analytics.
  • Analysera anvandarbeteende efter engagement med chatboten.
  • Tillskriva kampanjer som driver chatbot-engagement.
Logo

Redo att växa ditt företag?

Starta din kostnadsfria provperiod idag och se resultat inom några dagar.

Begär demo Logga in

Vardpaginas → flodes-kommunikation mitt i konversationen

Tillagt i april 2026 som en del av FlowHunts Chat Hook-funktion.

I single-page-applikationer halls chattfonstret typiskt oppet medan anvandaren navigerar mellan vyer. Nar chatten korr blir flowVariables som skickats via setConfig() inaktuella, och det finns inget satt att signalera till flodet att nagot hant pa vardpaginan. En enda hanterarmetod — sendHook(name, payload, options?) — tacker bade “utlos en trigger” och “uppdatera bara kontext”-anvandningsfallen:

  • Skicka ett name och (valfritt) en payload for att utlosa flodets Chat Hook-trigger. Flodesforfattaren placerar en Chat Hook-nod pa canvasen och grenlar pa {ChatHook.hook_name} for att avgora vad som ska goras.
  • Skicka options.flowVariables for att samtidigt sammanfoga sessionsvariabler — vardena bevaras innan triggern utloses och forblir tillgangliga for resten av sessionen.
  • Om flodet inte har nagon Chat Hook-trigger ar anropet en tyst 200 no-op: options.flowVariables sammanfogas anda, men ingen trigger korr och inga krediter debiteras. Det innebar att vardpaginas kan anropa sendHook() optimistiskt utan att veta om flodesforfattaren har kopplat in en trigger an.

sendHook() ar en saker no-op innan sessionen finns (buffras internt och tomms nar sessionen har skapats) och kastar aldrig undantag till vardpaginan — natverksfel loggas endast via console.warn.

Indata-granser

Server- och klientsidegranser som galler for sendHook(). Att bryta mot dem ar ingen krasch — backend returnerar HTTP 422 och hanteraren loggar via console.warn utan att kasta undantag.

BegransningGranserdVar den verkstallsVid overtradelse
sendHook name-langd1–256 teckenBackend (Pydantic)HTTP 422, triggern utloses inte
Antal nycklar i options.flowVariables≤ 64Backend (Pydantic)HTTP 422, inget bevaras
Langd pa varje nyckel i options.flowVariables≤ 128 teckenBackend (Pydantic)HTTP 422, inget bevaras
Pre-session-anrop som hanteraren buffrar50Widget (i webblasare)Aldsta koade anropet kastas och en console.warn loggas

Pre-session-buffergranser har bara betydelse pa sidor dar sessionsskapandet aldrig lyckas (t.ex. ett permanent natverksfel). Under normala forhallanden tomms koan sa snart onFHChatbotSessionCreated utloses.

1. Lagga till en Chat Hook-trigger (flodesforfattarens sida)

  1. Oppna flodet som ar kopplat till din chatbot i FlowHunt-editorn.
  2. Dra en Chat Hook-triggernod till canvasen. Editorn tillater bara en trigger per flode — flera ar inte tillatna.
  3. (Valfritt) Aktivera Validate Payload Schema och definiera ett JSON Schema som inkommande payload maste matcha. Validering korrs inne i steget — en ooverensstammelse visas som ett flodesfelhandelse (endpointen returnerar fortfarande 200; felet syns via onFHError).
  4. Koppla triggerns utdata (hook_name, payload, flow_variables) till de nedstroms-steg du vill kora (Generator, Chat Output, Tool Calls, villkorade grenar pa hook_name osv.).
  5. Publicera flodet.

2. Grena pa olika hook-namn inne i flodet

name som vardpaginan skickar till sendHook() ar en etikett som ditt flode kan grena pa, inte en routingnyckel — backend matchar inte namn mot noder. Istallet utloses flodets enda Chat Hook-trigger och exponerar namnet som {ChatHook.hook_name}, vilket du refererar till i din flodeslogik for att avgora vad som ska goras.

Exempel pa systemprompt:

If {ChatHook.hook_name} is "screen_changed", briefly summarise the page at
{ChatHook.payload.url}. If it is "user_action", acknowledge the action and
update memory. Otherwise, continue the conversation normally.

For mer komplex routing, koppla ett villkorssteg pa {ChatHook.hook_name} och grena ut till flera nedstroms-banor.

3. chatbotManager.sendHook(name, payload, options?)

chatbotManager.sendHook(
  name: string,
  payload?: Record<string, unknown>,
  options?: { flowVariables?: Record<string, unknown> }
): Promise<void>;

Argument

ArgumentTypObligatorisktBeskrivning
namestringjaEtikett som vidarebefordras till flodet som {ChatHook.hook_name}. Triggern utloses oavsett varde; din flodeslogik grenlar pa det.
payloadobjectnejJSON-payload som skickas till triggern som {ChatHook.payload}. Valideras mot nodens schema om det ar aktiverat. Standard {}.
options.flowVariablesobjectnejSessionsvariabler att sammanfoga innan triggern utloses. Tillgangliga for nedstroms-steg och framtida anvandarmeddelanden.

Beteende

  • Att anropa fore onFHChatbotSessionCreated ar sakert; anropet buffras och tomms nar sessionen finns. Bufferten har en granserd — se Indata-granser ovan.
  • Om flodet inte har nagon Chat Hook-trigger ar forfragan en tyst 200 no-op — sa vardpaginas kan anropa sendHook() optimistiskt innan flodesforfattaren har kopplat in en trigger. options.flowVariables bevaras anda i det fallet, sa samma anrop fungerar som en kontextuppdatering.
  • Om Chat Hook-triggern har schemavalidering aktiverad och payloaden inte klarar den, korrs valideringen inne i steget — endpointen returnerar 200 men flodet skickar ut en stegfelhandelse (observerbar via onFHError).
  • name och options.flowVariables ar avgransade — se Indata-granser ovan. Overtradelser returnerar HTTP 422 och inget bevaras.
  • Lyckade anrop skickar en onFHChatbotFlowVariablesUpdate-handelse om options.flowVariables skickades med (se Handelseoversikt).
  • Kastar aldrig undantag. Natverksfel och icke-2xx-svar loggas via console.warn.

Exempel — proaktivt forslag vid SPA-navigering

window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
  window.addEventListener('hashchange', function () {
    chatbotManager.sendHook('screen_changed', {
      url: window.location.href,
      screen_name: getScreenName(),
    }, {
      flowVariables: { current_page_url: window.location.href },
    });
  });
});

Exempel — endast kontextuppdatering (ingen Chat Hook kopplad)

Om flodet inte har nagon Chat Hook-trigger ar anropet en tyst 200 — sa samma API kan halla flow_variables synkat utan att utlosa nagonting:

window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
  window.addEventListener('hashchange', function () {
    chatbotManager.sendHook('navigate', {}, {
      flowVariables: {
        current_page_url: window.location.href,
        screen_name: getScreenName(),
      },
    });
  });
});

4. Hur flodesforfattaren konsumerar dessa varden

  • {ChatHook.hook_name} och {ChatHook.payload.foo} — varden som skickats via sendHook('x', { foo: 1 }) exponeras pa Chat Hook-triggerns korbana. Endast tillgangliga pa banan som startats av hookens utlosning.
  • {flow_variables.foo} — varden som skickats via options.flowVariables sammanfogas i sessionens variabelpase innan triggern utloses. Varje korbana (inklusive vanliga Chat Input-utlosta anvandarmeddelanden) kan lasa dem.

Om du vill att nasta anvandarmeddelande ska se ett nytt varde, lagg det i options.flowVariables — enbart payload paverkar bara den korning som startades av den hooken.

Handelseoversikt

FlowHunt JS API skickar 11 anpassade handelser pa window-objektet. Alla handelser anvander CustomEvent -API:t med bubbles: true och composed: true.

onFHChatbotReady

Utloses nar chatbot-widgeten har renderats helt och ar redo att anvandas.

  • Handelsedata: ingen.
  • Nar: efter att widgetens DOM har monterats och chattknappen ar synlig.

onFHChatbotSessionCreated

Utloses nar en ny chattsession skapas pa servern.

  • Handelsedata: event.detail.sessionId — ID:t for den nyligen skapade sessionen.
  • Nar: efter ett lyckat API-anrop for sessionsskapande.

onFHChatbotWindowOpened

Utloses nar anvandaren oppnar chattfonstret. Utloses inte i inbaddat lage.

onFHChatbotWindowClosed

Utloses nar anvandaren stanger chattfonstret. Utloses inte i inbaddat lage.

onFHMessageSent

Utloses nar anvandaren skickar ett meddelande.

event.detail.metadata = {
  content: 'Hello, I need help with...',
  createdAt: '2026-02-19T10:30:00.000Z',
};

onFHMessageReceived

Utloses nar chatboten tar emot och visar ett svar.

event.detail.metadata = {
  flow_id: 'abc123',
  message_id: 'msg_456',
  message: 'Sure, I can help you with that!',
  sender: {
    sender_name: 'Support Agent',
    sender_avatar: 'https://example.com/avatar.png',
  },
};

sender ar valfritt och finns bara nar en mansklig agent ar inblandad.

onFHFormDataSent

Utloses nar anvandaren skickar formularsdata via chatboten.

event.detail.metadata = {
  objectData: { name: 'John', email: 'john@example.com' },
  createdAt: '2026-02-19T10:31:00.000Z',
};

onFHFeedback

Utloses nar en anvandare ger tumme upp / tumme ner-feedback pa ett chatbotmeddelande.

event.detail.metadata = {
  message_id: 'msg_456',
  content: 'Optional feedback text',
  feedback: 'P', // 'P' = positive, 'N' = negative
};

onFHToolCall

Utloses nar ett verktyg eller en aktion korrs under flodesbearbetning. Utloses bara i flowAssistant- och flowAssistantV3-lagen.

event.detail.metadata = {
  metadata: {
    flow_id: 'abc123',
    message_id: 'msg_789',
    message: 'Calling search API...',
  },
  createdAt: '2026-02-19T10:32:00.000Z',
};

onFHError

Utloses nar ett fel uppstar under chatbotens drift.

event.detail.metadata = {
  metadata: {
    flow_id: 'abc123',
    message_id: 'msg_err',
    message: 'Flow execution failed',
  },
  createdAt: '2026-02-19T10:33:00.000Z',
};

onFHChatbotFlowVariablesUpdate

Tillagt i april 2026.

Utloses efter ett lyckat chatbotManager.sendHook(...)-anrop som skickade med options.flowVariables. Utloses inte for sendHook()-anrop som utelamnar flowVariables.

event.detail = {
  variables: {
    current_page_url: 'https://example.com/products',
    screen_name: 'products',
  },
};

Anvand den for att observera sammanfogade variabler (t.ex. for att synka ditt eget vardsidestillstand, for felsokning eller for att rita om ett UI-element som beror pa samma data).

Prenumerera pa handelser

Det finns tva satt att prenumerera pa chatbothendelser.

Metod 1: Fonsterhendelseavlyssnare

Anvand window.addEventListener var som helst pa din sida. Detta fungerar aven innan chatboten har laddats:

<script>
document.addEventListener('DOMContentLoaded', function () {
  window.addEventListener('onFHChatbotReady', function () {
    console.log('Chatbot is ready');
  });

  window.addEventListener('onFHChatbotSessionCreated', function (event) {
    console.log('Session created:', event.detail.sessionId);
  });

  window.addEventListener('onFHChatbotWindowOpened', function () {
    console.log('Chat window opened');
  });

  window.addEventListener('onFHChatbotWindowClosed', function () {
    console.log('Chat window closed');
  });

  window.addEventListener('onFHMessageSent', function (event) {
    console.log('User sent:', event.detail.metadata.content);
  });

  window.addEventListener('onFHMessageReceived', function (event) {
    console.log('Bot replied:', event.detail.metadata.message);
  });

  window.addEventListener('onFHFormDataSent', function (event) {
    console.log('Form submitted:', event.detail.metadata.objectData);
  });

  window.addEventListener('onFHFeedback', function (event) {
    var fb = event.detail.metadata;
    console.log('Feedback on message', fb.message_id, ':', fb.feedback);
  });

  window.addEventListener('onFHToolCall', function (event) {
    console.log('Tool called:', event.detail.metadata);
  });

  window.addEventListener('onFHError', function (event) {
    console.error('Chatbot error:', event.detail.metadata);
  });

  window.addEventListener('onFHChatbotFlowVariablesUpdate', function (event) {
    console.log('Variables merged:', event.detail.variables);
  });
});
</script>

For att ta bort en avlyssnare, behall handler-referensen:

var handleMessage = function (event) {
  console.log(event.detail.metadata);
};
window.addEventListener('onFHMessageReceived', handleMessage);
// Later …
window.removeEventListener('onFHMessageReceived', handleMessage);

Metod 2: Hanterarens callback-metoder

I init()-callbacken anvander du chatbot-hanterarens inbyggda metoder:

window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
  chatbotManager.onSessionCreated(function () {
    console.log('Session created');
  });

  chatbotManager.onWindowOpened(function () {
    console.log('Window opened');
  });

  chatbotManager.onWindowClosed(function () {
    console.log('Window closed');
  });

  chatbotManager.onMessageSent(function (event) {
    console.log('User sent:', event.metadata);
  });

  chatbotManager.onMessageReceived(function (event) {
    console.log('Bot replied:', event.metadata);
  });

  chatbotManager.onFormDataSent(function (event) {
    console.log('Form data:', event.metadata);
  });

  chatbotManager.onFeedback(function (event) {
    console.log('Feedback:', event.metadata);
  });

  chatbotManager.onToolCall(function (event) {
    console.log('Tool call:', event.metadata);
  });

  chatbotManager.onError(function (event) {
    console.error('Error:', event.metadata);
  });
});

Referens for hanterarmetoder

MetodParametrarBeskrivning
onSessionCreated(fn)fn: () => voidLyssna pa sessionsskapande
onWindowOpened(fn)fn: () => voidLyssna pa fonsteroppning
onWindowClosed(fn)fn: () => voidLyssna pa fonsterstangning
onMessageSent(fn)fn: (event) => voidLyssna pa anvandarmeddelanden
onMessageReceived(fn)fn: (event) => voidLyssna pa botsvar
onFormDataSent(fn)fn: (event) => voidLyssna pa formularinlamningar
onFeedback(fn)fn: (event) => voidLyssna pa anvandarfeedback
onToolCall(fn)fn: (event) => voidLyssna pa verktygskorningar
onError(fn)fn: (event) => voidLyssna pa fel
openChat()—Oppnar chattpanelen
closeChat()—Stanger chattpanelen
sendHook(name, payload?, options?) (ny)name: string, payload?: object, options?: { flowVariables?: object }Utloser Chat Hook-triggern i det korande flodet (eller sammanfogar options.flowVariables tyst om ingen trigger ar kopplad)

Anpassad chattaktivering: dolj knapp och oppna vid klick

For att helt kontrollera nar chatboten visas, dolj den flytande standardknappen och oppna chatten programmatiskt — till exempel fran din egen anpassade knapp.

<button id="my-chat-button">Chat with us</button>

<script id="fh-chatbot-script-YOUR_CHATBOT_ID">
  var currentScript = document.currentScript
    || document.getElementById('fh-chatbot-script-YOUR_CHATBOT_ID');

  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://app.flowhunt.io/api/chatbot/YOUR_CHATBOT_ID'
    + '?workspace_id=YOUR_WORKSPACE_ID&v=2';

  script.onload = function () {
    window.FHChatbot_YOUR_CHATBOT_ID.setConfig({ showChatButton: false });

    window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
      document.getElementById('my-chat-button')
        .addEventListener('click', function () {
          chatbotManager.openChat();
        });
    });
  };

  if (currentScript && currentScript.parentNode) {
    currentScript.parentNode.insertBefore(script, currentScript.nextSibling);
  } else {
    document.head.appendChild(script);
  }
</script>

Visa en anpassad knapp forst nar chatboten ar redo

Du kan kombinera dold aktivering med handelselyssnare for att skapa avancerade interaktioner:

<button id="open-chat" style="display:none;">Need help?</button>

<script>
  window.addEventListener('onFHChatbotReady', function () {
    document.getElementById('open-chat').style.display = 'block';
  });
</script>

<script id="fh-chatbot-script-YOUR_CHATBOT_ID">
  var currentScript = document.currentScript
    || document.getElementById('fh-chatbot-script-YOUR_CHATBOT_ID');

  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://app.flowhunt.io/api/chatbot/YOUR_CHATBOT_ID'
    + '?workspace_id=YOUR_WORKSPACE_ID&v=2';

  script.onload = function () {
    window.FHChatbot_YOUR_CHATBOT_ID.setConfig({ showChatButton: false });

    window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
      document.getElementById('open-chat')
        .addEventListener('click', function () {
          chatbotManager.openChat();
        });
    });
  };

  if (currentScript && currentScript.parentNode) {
    currentScript.parentNode.insertBefore(script, currentScript.nextSibling);
  } else {
    document.head.appendChild(script);
  }
</script>

Komplett integrationsexempel

Ett fullstandigt fungerande exempel som demonstrerar konfigurationsoverskrivningar, handelsesparning, anpassad chattaktivering och den nya sendHook()-metoden tillsammans:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>FlowHunt Chatbot Integration</title>
  </head>
  <body>
    <h1>My Website</h1>
    <button id="open-chat-btn">Talk to our AI assistant</button>
    <button id="close-chat-btn">Close chat</button>

    <!-- Subscribe to events before the chatbot loads -->
    <script>
      document.addEventListener('DOMContentLoaded', function () {
        window.addEventListener('onFHChatbotReady', function () {
          console.log('Chatbot widget is ready');
        });

        window.addEventListener('onFHChatbotSessionCreated', function (event) {
          console.log('New chat session started:', event.detail.sessionId);
        });

        window.addEventListener('onFHMessageSent', function (event) {
          console.log('User message:', event.detail.metadata.content);
        });

        window.addEventListener('onFHMessageReceived', function (event) {
          console.log('Bot response:', event.detail.metadata.message);
        });

        window.addEventListener('onFHChatbotFlowVariablesUpdate', function (event) {
          console.log('Context updated:', event.detail.variables);
        });

        window.addEventListener('onFHError', function (event) {
          console.error('Chatbot error:', event.detail.metadata);
        });
      });
    </script>

    <!-- FlowHunt integration -->
    <script id="fh-chatbot-script-YOUR_CHATBOT_ID">
      var currentScript = document.currentScript
        || document.getElementById('fh-chatbot-script-YOUR_CHATBOT_ID');

      var script = document.createElement('script');
      script.async = true;
      script.src = 'https://app.flowhunt.io/api/chatbot/YOUR_CHATBOT_ID'
        + '?workspace_id=YOUR_WORKSPACE_ID&v=2';

      script.onload = function () {
        window.FHChatbot_YOUR_CHATBOT_ID.setConfig({
          showChatButton: false,
          headerTitle: 'AI Assistant',
          maxWindowWidth: '600px',
          flowVariables: {
            source: 'website',
            current_page_url: window.location.href,
          },
          urlSuffix: '?utm_source=chatbot',
        });

        window.FHChatbot_YOUR_CHATBOT_ID.init(function (chatbotManager) {
          // Open / close from custom buttons
          document.getElementById('open-chat-btn')
            .addEventListener('click', function () {
              chatbotManager.openChat();
            });
          document.getElementById('close-chat-btn')
            .addEventListener('click', function () {
              chatbotManager.closeChat();
            });

          // Keep the flow's context in sync with SPA navigation and
          // optionally fire the Chat Hook trigger (if the flow has one wired).
          // If the flow has no Chat Hook, the call is a silent 200 — the
          // flow_variables still get merged, so the same line covers both
          // "notify the flow" and "just update context".
          window.addEventListener('hashchange', function () {
            chatbotManager.sendHook('screen_changed', {
              url: window.location.href,
            }, {
              flowVariables: { current_page_url: window.location.href },
            });
          });
        });
      };

      if (currentScript && currentScript.parentNode) {
        currentScript.parentNode.insertBefore(script, currentScript.nextSibling);
      } else {
        document.head.appendChild(script);
      }
    </script>
  </body>
</html>

Vanliga frågor

Lär dig mer

FlowHunt 2.6.12: Slack-integration, intentklassificering och mer
FlowHunt 2.6.12: Slack-integration, intentklassificering och mer

FlowHunt 2.6.12: Slack-integration, intentklassificering och mer

FlowHunt 2.6.12 introducerar Slack-integration, intentklassificering och Gemini-modellen, vilket förbättrar AI-chattbotens funktionalitet, kundinsikter och team...

3 min läsning
FlowHunt AI Chatbot +5