Smart Answer: resposta de IA na pesquisa do seu site
Como incorporar o Smart Answer: script suche.js, caixa no markup, interface HTTP pública para páginas de pesquisa renderizadas no servidor, fluxo de resposta por Server-Sent Events, estilo por variáveis CSS e transferência para o chat.
O Smart Answer mostra uma resposta curta à pergunta do visitante acima ou abaixo dos resultados da pesquisa do seu site, transmitida em fluxo, com fontes da base de conhecimento e um campo para a próxima pergunta. O Smart Answer é um serviço separado; usa a mesma base de conhecimento do assistente do chat. Ele é ativado e estilizado na conta, em Projeto → Smart Answer para pesquisa no site.
Incorporar com suche.js
Se o carregador do chat já estiver na página, basta uma linha:
<script src="https://cdn.reactive.chat/suche.js" async></script>
Sem o widget de chat, passe a chave do site:
<script src="https://cdn.reactive.chat/suche.js" data-site-key="SITE_KEY" async></script>
O script se conecta aos campos de pesquisa da sua página (você define quais na conta, por um seletor CSS), espera o envio ou uma pausa na digitação e mostra a resposta em uma caixa no local configurado (antes, depois ou dentro de um elemento de destino). Por padrão, só responde a entradas que parecem perguntas.
Atributos na tag script:
- data-site-key (opcional) – caso contrário, obtido do carregador do chat (
data-rc-site-key). - data-ws-url (opcional) – endereço do chat; caso contrário, deduzido como no chat.
- data-api (opcional) – endereço base da interface, padrão
https://ws.reactive.chatou seu domínio próprio. - data-locale (opcional) – idioma; caso contrário,
<html lang>e depois o navegador.
O script não define cookies e armazena dados apenas em sessionStorage. Para a CSP, precisa de script-src https://cdn.reactive.chat e connect-src https://ws.reactive.chat (Segurança e CSP).
Transferência para o chat
Se o visitante fizer uma pergunta de acompanhamento na caixa, dependendo da configuração Pergunta de acompanhamento, a conversa continuará no widget de chat (ReactiveChat('continueConversation', id, text) ou ReactiveChat('startConversation', text)) ou será respondida na mesma caixa. Sem o widget de chat na página, a pergunta de acompanhamento sempre permanece na caixa.
Estilo
A caixa (.rc-ai) traz seu próprio CSS e é protegida contra os resets da sua página. Você pode ajustá-la por variáveis com a menor especificidade:
.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;
}
Você altera partes individuais com .rc-ai .rc-ai__teil { … } no campo CSS personalizado da conta, por exemplo, .rc-ai .rc-ai__hinweis { display: none; }. A camada de proteção não protege contra regras da sua página com #id ou !important.
Interface HTTP
Para páginas de pesquisa renderizadas no servidor ou interfaces próprias, há uma interface pública sem autenticação e sem cookies em https://ws.reactive.chat/api/suche/SITE_KEY.
Comum a todos os endpoints:
- CORS somente para origens dos domínios do seu projeto (incluindo subdomínios); chamadas do seu servidor sem
Originsempre funcionam. - Limite: 60 requisições por minuto e por endereço de visitante em todos os endpoints → 429 com
Retry-AftereX-RateLimit-*. Se você chamar do seu servidor, o endereço dele conta; por isso, para muitos visitantes, usesuche.jsno navegador ou o domínio próprio com uma chave de proxy. - Perguntas e respostas não são gravadas em logs de acesso.
GET /api/suche/SITE_KEY?locale=de – configuração, CSS e modelo vazio da caixa (Cache-Control: public, max-age=60):
{"v":1,"aktiv":false}– desativado, bloqueado ou desconhecido (404 para uma chave desconhecida).{"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 – HTML pronto da caixa para uma pergunta, corpo de no máximo 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":""}– a entrada não é uma pergunta.{"v":1,"aktiv":true,"frage":true,"html":"…","css":"<style id=\"rc-ai-css\">…</style>","skript":"…","einbettung":"…"}– insiraeinbettungna sua página de pesquisa;suche.jspreenche a caixa com a resposta.- 400
{"v":1,"error":"bad_request","field":"q"}–qestá ausente, vazio ou tem mais de 300 caracteres. - 413
payload_too_large, 405 para qualquer outro método.
POST /api/suche/SITE_KEY/antwort – a própria resposta como fluxo de Server-Sent Events, corpo de no máximo 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 (string, obrigatório, 1–300 caracteres)
- locale (string, opcional)
- visitor_id (string, opcional,
[A-Za-z0-9_-]{1,80}) – o ID do visitante do chat, para que a transferência ao chat corresponda. - ctx (objeto, opcional) –
url,path,referrer,title; query e âncora são removidas. - folge (
true, opcional) – pergunta de acompanhamento; ignora o filtro de perguntas. - vorher (lista, opcional) – no máximo 3 pares anteriores (
q≤ 300,a≤ 1500 caracteres).
Resposta 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. O primeiro evento é sempredenkt. - text –
{text}: o texto inteiro visível até o momento (não um delta), no máximo a cada 150 ms. - fertig –
{text, quellen, fortsetzung};fortsetzungé{art:"faden", id}(armazenado como conversa),{art:"neu"}ounull. - fehler –
{code, text?}comcode:aus,gesperrt,drossel,motor,zeit,einwilligung,ungueltig. Sefehlervier depois detext, mantenha o texto.
Depois de fertig ou fehler, o fluxo termina. Erros anteriores ao início também chegam como um fluxo com exatamente um fehler (HTTP 404, 429, 400, 413, 503 ou 200). Se não houver texto após 45 segundos ou término após 90 segundos, segue fehler zeit. Se você fechar a conexão, a resposta será interrompida. Um proxy no caminho deve repassar o fluxo sem buffering.
// 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]));
}
}
A seguir: Integração de privacidade
Zadnje ažurirano: