Документация

Создание чата

Используйте веб конструктор, чтобы создать и сконфигурировать чат через веб интерфейс. Используйте готовые плагины: WordPressOpencartJoomlaDrupal

Чтобы чат появился на вашем сайте, скопируйте javascript код из конструктора в раздел head html кода сайта. Код достаточно вставить один раз. При изменении настроек в конструкторе чат на сайте будет меняться автоматически.

Код для встраивания

<script id="chatBroEmbedCode">
    /* Chatbro Widget Embed Code Start */
    function ChatbroLoader(chats, async) {
        async = !1 !== async;
        var params = {
            embedChatsParameters: chats instanceof Array ? chats : [chats],
            lang: navigator.language || navigator.userLanguage,
            needLoadCode: 'undefined' == typeof Chatbro,
            embedParamsVersion: localStorage.embedParamsVersion,
            chatbroScriptVersion: localStorage.chatbroScriptVersion
        },
        xhr = new XMLHttpRequest;
        xhr.withCredentials = !0;
        xhr.onload = function() {
            eval(xhr.responseText);
        };
        xhr.onerror = function() {
            console.error('Chatbro loading error')
        };
        xhr.open('GET', 'https://www.chatbro.com/embed.js?' +
            btoa(unescape(encodeURIComponent(JSON.stringify(params)))), async);
        xhr.send();
    }
    /* Chatbro Widget Embed Code End */
    ChatbroLoader({
        encodedChatId: 'YOUR ENCODED CHAT_ID'
    });
</script>

Динамическое создание

Например, вам нужны разные чаты для разных страниц вашего сайта. Если у вас есть видеохостинг, вы можете создать отдельный чат для каждого видео. Создавайте эти чаты на лету, используя функцию динамических чатов. Ознакомьтесь с подробным объяснением.

Синхронизация

• Пользовательский бот ВК.
• Пользовательский Telegram-бот.
• Автоматическая синхронизация с Telegram.

Таблица параметров

При создании чата в функцию ChatbroLoader передаются параметры, являющиеся приоритетными над параметрами из базы и сохраняющиеся в конструкторе.

Три типа чата:

• Статичный Встраивается в определенный блок на странице.
• Перемещаемый Свободно масштабируется и перемещается по странице. Контейнер под него можно создать в любом месте.
• История Как и статичный, встраивается в определенный блок страницы, разбивает историю чата на страницы, которые используются для индексации поисковиком.

Индексация чата

Для индексации используется отдельный url с разбитой по страницам историей чата.

Пример:  http://www.chatbro.com/43eM/history

Вставьте сюда чат с опцией истории (useStandardHistoryWidgetSettings = true).

Для навигации по истории нужно в параметрах чата передать chatPaginatorUrlPrefix Он будет использоваться в пэйджинатор. Пэйджинатор будет доступен только в том случае, если обновление сообщений отключено (allowUploadMessages = false).

При переходе по страницам, номер страницы добавляется в url. Его надо передать в параметре batchId.

ChatbroLoader({
    encodedChatId: '43eM',
    containerDivId: "someDivId",
    useStandardHistoryWidgetSettings: true,
    chatPaginatorUrlPrefix: 'http://www.chatbro.com/43eM/history'
});

Единый вход

Пользователь, пройдя процедуру аутентификации на вашем сайте, логинится в чате. В чате будут использованы такие же никнейм и аватар, как на сайте. Также будет доступна ссылка на профиль пользователя. Пример реализации.

Фильтрация сообщений

Чтобы избежать нежелательных сообщений, вы можете включить фильтрацию сообщений на стороне сервера. Это можно сделать в конструкторе чата, в разделе «Администрирование». Функция фильтра использует JavaScript. Оператор return использует объект Java со статичными методами, которые возвращают различные действия (например, принимают, изменяют или отклоняют сообщение и другие).

Простейшая функция выглядит следующим образом:

function filter(lastMessages, newMessage, result) {
    return result.accept();
}

Она просто принимает сообщение пользователя без каких-либо проверок.

События

События выполняют с чатом всевозможные действия. Например, фильтровать ссылки. Обработчики событий определяются только после инициализации чата (срабатывает событие chatLoaded). События привязываются только к документу.

Пример:

document.addEventListener('chatLoaded', function() {
    document.addEventListener(...);
    document.addEventListener(...);
    document.addEventListener(...);
    ...
});

document.addEventListener('chatLoaded', function(event) {
    event.chat.audioControl.loadSoundFile('http://www.soundjay.com/misc/sounds/handbag-lock-4.mp3');
    document.addEventListener('newMessage', function(event) {
        var chat = event.chat;
        if (!chat.isActiveTab()) {
            event.chat.audioControl.play();
        }
    });
});

{
    text: '', - Текст сообщения
    attachments: [
        {
            type: 'photo/video', - тип вложения
            thumbnailPhotoUrl: '', - url превью изображения
            originalPhotoUrl: '', - url изображения
            playerUrl: '' - Url вложения. Только для type = video
        }
        ...
    ],
    links: [
        {
            host: '', - хост ссылки
            protocol: '', - протокол ссылки
            url: '' - оригинальный адрес ссылки
        }
        ...
    ]
}

CMS

Плагины реализуют прозрачную аутентификацию для пользователей CMS. Защиту от спуфинга. Страницу истории для индексации поисковыми машинами. Просты в установке и настройке чата.

Incorrect signature

Signature (хэш-подпись) - уникальная строка, которая генерируется на сервере пользователя на основе параметров, переданных в функцию ChatbroLoader, и передаётся на сервер чатбро, где сравнивается. Подпись нужна для защиты чата от подмены пользователей и передачи данных с чужих доменов. Хэш-подпись защищает ваш чат от копирования на другие сайты. Если включена защита от спуфинга, чат будет работать, только если подпись рассчитана верно и домен сайта соответствует переданному.
Больше о спуфинге 

Как исправить ошибку?

Мы сделали отдельную страницу, которая поможет вам понять, как правильно все сделать.