Smart Answer: AI-svar i din webbplatssökning

Smart Answer visar ett kort svar på besökarens fråga ovanför eller nedanför resultaten i din webbplatssökning – strömmat, med källor från kunskapsbasen och ett fält för nästa fråga. Smart Answer är en separat tjänst; den använder samma kunskapsbas som chattassistenten. Den aktiveras och utformas i kontot under Projekt → Smart Answer för webbplatssökning.

Bädda in med suche.js

Om chattladdaren redan finns på sidan räcker en rad:

<script src="https://cdn.reactive.chat/suche.js" async></script>

Utan chattwidgeten skickar du med webbplatsnyckeln:

<script src="https://cdn.reactive.chat/suche.js" data-site-key="SITE_KEY" async></script>

Skriptet kopplar sig till sidans sökfält (vilka anger du som CSS-selektor i kontot), väntar på att besökaren skickar sökningen eller gör en paus i skrivandet och visar svaret i en ruta på den inställda platsen (före, efter eller inuti ett målelement). Som standard besvarar det bara inmatning som ser ut som en fråga.

Attribut på skripttaggen:

• data-site-key (valfritt) – hämtas annars från chattladdaren (data-rc-site-key).
• data-ws-url (valfritt) – chattadress; härleds annars som för chatten.
• data-api (valfritt) – gränssnittets basadress, standard https://ws.reactive.chat eller din egna domän.
• data-locale (valfritt) – språk; annars <html lang>, sedan webbläsaren.

Skriptet sätter inga cookies och lagrar data bara i sessionStorage. För CSP behöver det script-src https://cdn.reactive.chat och connect-src https://ws.reactive.chat (Säkerhet och CSP).

Överlämning till chatten

Om besökaren ställer en följdfråga i rutan fortsätter konversationen – beroende på inställningen Följdfråga – i chattwidgeten (ReactiveChat('continueConversation', id, text) eller ReactiveChat('startConversation', text)) eller besvaras i samma ruta. Utan chattwidget på sidan stannar följdfrågan alltid i rutan.

Utseende

Rutan (.rc-ai) har egen CSS och är skyddad mot sidans återställningsregler. Du kan anpassa den via variabler med lägsta specificitet:

.rc-ai {
  --rc-ai-akzent: #0a7cff;
  --rc-ai-hg: var(--karte, #fff);
  --rc-ai-text: #1d1d1f;
  --rc-ai-rand: #e3e3e8;
  --rc-ai-radius: 10px;
  --rc-ai-schrift: inherit;
  --rc-ai-abstand: 20px;
  --rc-ai-schriftgroesse: 16px;
  --rc-ai-zeilenhoehe: 1.6;
}

Enskilda delar ändrar du med .rc-ai .rc-ai__teil { … } i fältet Egen CSS i kontot, till exempel .rc-ai .rc-ai__hinweis { display: none; }. Skyddslagret skyddar inte mot regler på din sida med #id eller !important.

HTTP-gränssnitt

För serverrenderade söksidor eller egna gränssnitt finns ett offentligt gränssnitt utan autentisering och cookies på https://ws.reactive.chat/api/suche/SITE_KEY.

Gemensamt för alla slutpunkter:

• CORS bara för ursprung från projektets domäner (inklusive underdomäner); anrop från din server utan Origin fungerar alltid.
• Begränsning: 60 anrop per minut och besökaradress över alla slutpunkter → 429 med Retry-After och X-RateLimit-*. Om du anropar från servern räknas serverns adress – använd därför suche.js i webbläsaren eller egen domän med proxynyckel om du har många besökare.
• Frågor och svar skrivs inte till åtkomstloggar.

GET /api/suche/SITE_KEY?locale=de – konfiguration, CSS och tom mall för rutan (Cache-Control: public, max-age=60):

• {"v":1,"aktiv":false} – avstängt, blockerat eller okänt (404 för okänd nyckel).
• {"v":1,"aktiv":true,"sprache":"de","konfig":{…},"css":"…","vorlage":"<div class=\"rc-ai\" …>","skript":"https://cdn.reactive.chat/suche.js"}

POST /api/suche/SITE_KEY – färdig HTML för rutan för en fråga, meddelandekropp högst 4 KB:

curl -s -X POST "https://ws.reactive.chat/api/suche/SITE_KEY" \
  -H "Content-Type: application/json" \
  -d '{"q":"How long does shipping take?","locale":"en"}'

• {"v":1,"aktiv":true,"frage":false,"html":""} – inmatningen är ingen fråga.
• {"v":1,"aktiv":true,"frage":true,"html":"…","css":"<style id=\"rc-ai-css\">…</style>","skript":"…","einbettung":"…"} – infoga einbettung på din söksida; suche.js fyller sedan rutan med svaret.
• 400 {"v":1,"error":"bad_request","field":"q"} – q saknas, är tomt eller längre än 300 tecken.
• 413 payload_too_large, 405 för alla andra metoder.

POST /api/suche/SITE_KEY/antwort – själva svaret som en Server-Sent Events-ström, meddelandekropp högst 8 KB:

{"q":"How long does shipping take?","locale":"en",
 "visitor_id":"v_…",
 "ctx":{"url":"https://shop.example/search","title":"Search"},
 "folge":false,
 "vorher":[{"q":"…","a":"…"}]}

• q (sträng, obligatorisk, 1–300 tecken)
• locale (sträng, valfri)
• visitor_id (sträng, valfri, [A-Za-z0-9_-]{1,80}) – chattbesökarens ID, så att överlämningen till chatten stämmer.
• ctx (objekt, valfritt) – url, path, referrer, title; frågesträng och ankare tas bort.
• folge (true, valfritt) – följdfråga; kringgår frågefiltret.
• vorher (lista, valfri) – högst 3 tidigare par (q ≤ 300, a ≤ 1 500 tecken).

Svar text/event-stream:

event: status
data: {"stufe":"denkt"}

event: text
data: {"text":"Shipping usually takes"}

event: fertig
data: {"text":"Shipping usually takes 2–3 working days.","quellen":[{"titel":"Shipping","url":"https://shop.example/shipping"}],"fortsetzung":{"art":"faden","id":"01J…"}}

• status – {stufe}: denkt, sucht, schreibt, wartet. Den första händelsen är alltid denkt.
• text – {text}: hela texten som är synlig hittills (inte en förändring), högst var 150:e ms.
• fertig – {text, quellen, fortsetzung}; fortsetzung är {art:"faden", id} (sparat som en konversation), {art:"neu"} eller null.
• fehler – {code, text?} med code: aus, gesperrt, drossel, motor, zeit, einwilligung, ungueltig. Om fehler kommer efter text låter du texten stå kvar.

Efter fertig eller fehler avslutas strömmen. Fel före starten kommer också som en ström med exakt en fehler (HTTP 404, 429, 400, 413, 503 eller 200). Om ingen text kommit efter 45 sekunder eller inget slut efter 90 sekunder följer fehler zeit. Om du stänger anslutningen avbryts svaret. En proxy på vägen måste släppa igenom strömmen utan buffring.

// read the stream in the browser (EventSource cannot POST)
const r = await fetch('https://ws.reactive.chat/api/suche/SITE_KEY/antwort', {
  method: 'POST', headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ q: frage, locale: 'en' }), credentials: 'omit'
});
const leser = r.body.getReader(); const dec = new TextDecoder(); let puffer = '';
for (;;) {
  const { value, done } = await leser.read(); if (done) break;
  puffer += dec.decode(value, { stream: true });
  let i; while ((i = puffer.indexOf('\n\n')) >= 0) {
    const block = puffer.slice(0, i); puffer = puffer.slice(i + 2);
    const ev = /^event: (.*)$/m.exec(block), da = /^data: (.*)$/m.exec(block);
    if (ev && da) zeige(ev[1], JSON.parse(da[1]));
  }
}

Nästa: Integrera integritetsskydd