Интеграция онлайн-чата (Jivo) на сайт
JivoSite — популярный российский онлайн-чат для сайтов. Поддерживает чат, звонки, email, соцсети в одном окне для операторов. Установка занимает минуты — вставить скрипт и настроить виджет.
Базовая установка
<!-- Вставить перед </body> или в <head> с async -->
<script src="//code.jivosite.com/widget/{WIDGET_ID}" async></script>
Для React/Next.js:
// components/JivoChat.tsx
useEffect(() => {
const script = document.createElement('script');
script.src = `//code.jivosite.com/widget/${process.env.NEXT_PUBLIC_JIVO_ID}`;
script.async = true;
document.body.appendChild(script);
return () => document.body.removeChild(script);
}, []);
Передача данных о пользователе
// Идентификация авторизованного пользователя
window.jivo_api?.setContactInfo({
name: user.name,
email: user.email,
phone: user.phone,
description: `ID: ${user.id}, заказов: ${user.orders_count}`
});
// Кастомные данные (отображаются оператору)
window.jivo_api?.setCustomData([
{title: 'Корзина', content: `${cartTotal} ₽`},
{title: 'Тариф', content: user.plan}
]);
Callback API для интеграции
Jivo предоставляет JS API для управления чатом программно:
function jivo_onMessageSent(message) {
// Пользователь отправил сообщение — можно логировать
analytics.track('chat_message_sent');
}
function jivo_onOpen() {
// Виджет открыт
analytics.track('chat_opened');
}
Срок установки: несколько часов, включая настройку передачи данных пользователя.