Tarayıcıdaki olaylar: on, off ve DOM olayları

Widget sohbette olanları iki yolla bildirir: ReactiveChat('on', …) ve window üzerindeki DOM olayları. İkisi de mesaj metni taşımaz; yalnızca bir şey olduğu bilgisini taşır. Sunucunuzdaki içerik için webhook’ları kullanın.

ReactiveChat('on') ve ('off')

function beiNachricht(e) {
  if (e.direction === 'in') { document.title = '(1) ' + document.title; }
}
ReactiveChat('on', 'message', beiNachricht);
// later:
ReactiveChat('off', 'message', beiNachricht);

on çağrısını yüklemeden önce yapabilirsiniz; abonelik kuyrukta bekler. Ancak on bir komuttur, dolayısıyla çekirdeği hemen yükler (command tetikleyicisi). Widget callback’inizdeki hataları yakalar; sohbeti bozmazlar. Bilinmeyen adlar sessizce yok sayılır.

Olaylar ve verileri:

• ready – { conversationId }. Bağlantı kuruldu; widget kullanılabilir. Dönüş değeri olan komutlar için doğru an.
• open – { trigger }. Pencere açıldı; trigger açanın ne olduğunu söyler (varsayılan api).
• close – {}. Pencere kapandı.
• message – { direction }. Mesaj geldi (in, ekipten veya asistandan) veya çıktı (out, ziyaretçiden). İçeriksiz.
• unread – { count }. Okunmamış mesaj sayısı değişti.
• csat – { score }. Ziyaretçi değerlendirme verdi (1 veya -1).
• handoff – { reason, to }. Sohbet aktarıldı; to değeri agent, queue, bot veya offline_form.
• proactive – { ruleId }. Kural proaktif mesaj tetikledi.
• ab – { test, variant, qa }. Ziyaretçi A/B varyantına atandı.
• teaser:shown – { ruleId, ts }. İpucu balonu göründü.
• teaser:click – { ruleId }. Balona tıklandı.
• teaser:dismiss – { ruleId }. Balon kapatıldı.
• teaser:reply – { ruleId, text }. Balonun hızlı yanıtı seçildi (text, kendinizin belirlediği düğme metnidir).
• promo:shown – { ort }. Tanıtım kartı görünürdü (gespraech veya start); konum ve sayfa görüntülemesi başına bir kez, yalnızca pencere açıkken.
• promo:click – { ziel, ort }. Kartın düğmesine (knopf) veya metin bağlantısına (link) tıklandı.

Örnek: olayları analiz aracına iletme

['open', 'close', 'csat', 'handoff', 'promo:click'].forEach(function (name) {
  ReactiveChat('on', name, function (e) {
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({ event: 'reactivechat_' + name.replace(':', '_'), rc: e });
  });
});

window üzerindeki DOM olayları

on çağrısından bağımsız olarak widget, window üzerinde CustomEvent üretir (yukarı yayılmazlar; bubbles: false). Her detail ayrıca ts içerir. Bunlar etiket yöneticileri gibi DOM olaylarını dinleyen araçlar için uygundur.

• reactivechat:ready – { sessionId, visitorId, version }
• reactivechat:opened – { conversationId, trigger }
• reactivechat:closed – { conversationId }
• reactivechat:message – { conversationId, direction }; asla metin değil
• reactivechat:bot_handoff – { conversationId, reason }
• reactivechat:csat – { score }
• reactivechat:proactive_shown – { ruleId }
• reactivechat:teaser_shown – { conversationId, ruleId }

window.addEventListener('reactivechat:opened', function (ev) {
  console.log('Chat open since', new Date(ev.detail.ts));
});

Widget’ın dinlediği olaylar

MousePlayer kullanıyorsanız widget, onun mouseplayer:ready, mouseplayer:frustration, mouseplayer:intent ve mouseplayer:milestone olaylarını değerlendirir; mouseplayer:frustration çekirdeği erken de yükler. Bunun için başka kaynak gerekmez.

Bulunmayan özellikler

• iframe modunda da sayfanız için postMessage kanalı yoktur.
• Mesaj metni taşıyan olay yoktur. İçeriği sunucu tarafında webhook’larla alırsınız.

Sonraki: Ziyaretçileri tanımlama ve bağlam iletme