Приклад інтеграції Webitel та Single Page Application

Цей документ описує основи інтеграції Webitel з будь-яким односторінковим веб-додатком (SPA).

Основні пункти інтеграції:

- 1.1 Важливо!
2 Загальні налаштування інтеграції Webitel:
3 Створення користувача та збереження токена інтеграції.
4 Використання клієнтської бібліотеки Webitel JavaScript для дзвінків WebRTC або функціоналу Click-To-Call.
5 Створення агента колл-центру для розширеної функціональності маршрутизації дзвінків (необов'язково).
6 Використання Webitel REST API для синхронізації історії дзвінків (необов'язково).
7 Робота з дайлером (необовʼязково).

Важливо!

Webitel та SPA повинні використовувати HTTPS-з'єднання з дійсними SSL-сертифікатами, які підписані відомими ЦС.

Загальні налаштування інтеграції Webitel:

Для цілей інтеграції, вам потрібно зберегти на боці SPA наступні 4 налаштування:

Кінцева точка Webitel REST API. Наприклад: https://cloud.webitel.com/api/
Кінцева точка Webitel Web Socket. Наприклад: wss://cloud.webitel.com/ws/
Токен інтеграції Webitel.
Домен користувачів Webitel. Внутрішній домен Webitel, наприклад: my-company.lo

Створення користувача та збереження токена інтеграції.

Name - ім'я користувача.
Login - логін користувача. Він може співпадати з розширенням користувача.Password - випадковий рядок.
Extension - внутрішній телефонний номер користувача.
Product license key - ліцензійний ключ продукту (користувачі без ліцензії не можуть увійти в Webitel).
WebRTC device - пристрій WebRTC (користувачі без пристрою не можуть використовувати дзвінки WebRTC з браузера).

Створення пристрою.

Ми створимо пристрій WebRTC для нашого майбутнього користувача, використовуючи кінцеву точку Webitel REST API та токен інтеграції.

POST https://cloud.webitel.com/api/devices
{
  "name": "device for user 1",
  "account": "sipUser1",
  "password": "BNZdVLryFwcB"
}

У відповіді ми отримаємо тіло з новим ідентифікатором пристрою:

{
    "id": "7287",
    "name": "device for user 1",
    "account": "sipUser1",
    "password": "BNZdVLryFwcB",
    "user": {},
    "logged_in": "1682943253855",
    "created_at": "1682943253855",
    "created_by": {
        "id": "130",
        "name": "Administrator"
    },
    "updated_at": "1682943253855",
    "updated_by": {
        "id": "130",
        "name": "Administrator"
    }
}

Створення користувача.

Тепер ми створимо користувача з пристроєм WebRTC, використовуючи кінцеву точку Webitel REST API та токен інтеграції:

POST https://dev.webitel.com/api/users

{
    "name": "User1",
    "email": "user1@gmail.com",
    "username": "2020",
    "password": "dl75lfLcOLLL",
    "extension": "2020",
    "roles": [
        {
            "id": 4
        }
    ], 
    "device": {
        "id": "7287"
    },
    "license": [
        {
            "id": "95309f22-0d7c-4fb9-baab-9911898019c4"
        }
    ],
    "devices": [
        {
            "id": "7287"
        }
    ]
}

У відповіді ми отримаємо тіло з новим ідентифікатором користувача:

Створення токену користувача.

Останнє, що нам знадобиться, – токен інтеграції для нового користувача:

У відповіді ви отримаєте токен для користувача:

Таким чином, всередині вашої SPA, для кожного користувача вам потрібно зберігати:

Ідентифікатор користувача (user ID).
Ідентифікатор пристрою (device ID).
Токен користувача (user token).

Використання клієнтської бібліотеки Webitel JavaScript для дзвінків WebRTC або функціоналу Click-To-Call.

Webitel має свою власну бібліотеку на JavaScript, яка підтримує наступні функції:

Ініціювання дзвінка;
Відповідь на вхідний дзвінок (тільки з використанням WebRTC);
Утримування дзвінка;
Перенаправлення дзвінка;
Надсилання DTMF-сигналу;
Завершення дзвінка.

Ви можете знайти приклад web-phone за цим посиланням: https://git.webitel.com/projects/WEP/repos/vue-phone-example/browse

Якщо вам не потрібні дзвінки за допомогою WebRTC, і ви будете використовувати апаратний телефон, ви можете використовувати Click-To-Call HTTP REST API: https://swagger.webitel.com/#/CallService

Створення агента колл-центру для розширеної функціональності маршрутизації дзвінків (необов'язково).

Якщо ви використовуєте черги колл-центру та авто-набір номерів (дайлер), вам потрібно створити агента для кожного користувача. Ви можете створити його за допомогою REST API-інтерфейсу Webitel та токену інтеграції: https://swagger.webitel.com/#/AgentService/AgentService_CreateAgent

Використання Webitel REST API для синхронізації історії дзвінків (необов'язково).

Якщо ви хочете отримати історію всіх дзвінків з Webitel на SPA, ви можете використовувати точку доступу Webitel REST API та токен інтеграції: https://swagger.webitel.com/#/CallService/CallService_SearchHistoryCall

Також ви можете отримати записи дзвінків: https://swagger.webitel.com/#/MediaFileService/MediaFileService_ReadMediaFile

Робота з дайлером (необовʼязково).

Ця частина описана на сторінці: Webitel REST API Usage Examples.