Как добавить кнопку «Позвонить» на сайт через SIP-API — пошагово без лишней воды

Вы хотите, чтобы клиент, зашедший на сайт с телефона, мог просто нажать кнопку — и сразу дозвониться до вашей компании. Не копировать номер, не искать его в телефоне, не ждать ответа на сообщение. Просто нажал — и звонок пошёл. Это называется click-to-call. И да, это можно сделать не через обычный tel: ссылки, а через SIP-API — так, чтобы звонок шёл через вашу телефонную систему, а не через мобильный оператор. И при этом вы получаете полный контроль: кто звонит, когда, с какого устройства, и даже можете перенаправить звонок на нужного оператора.

Я делал это для трёх компаний: интернет-магазин с доставкой, клиника с приёмом по записи и IT-агентство, где клиенты часто звонят с мобильных. Ни один из них не хотел терять звонки из-за неудобного интерфейса. Вот как мы это сделали — без привлечения дорогостоящих разработчиков и без траты месяца на тесты.

Почему не просто tel:+79991234567?

Да, вы можете просто вставить ссылку вида <a href="tel:+79991234567">Позвонить</a>. И она будет работать на iOS и Android. Но есть три больших минуса:

  • Звонок идёт через мобильный оператор — вы не видите, кто звонит, откуда, сколько длился, и не можете автоматически логировать звонок в CRM.
  • Если клиент звонит с компьютера — ничего не произойдёт. Никакого звонка. Только ошибка.
  • Вы не можете перенаправить звонок на другого оператора, если основной занят. Или на голосовую почту, если вне рабочего времени.

SIP-API решает это. Он позволяет запускать звонок не через оператора, а через вашу IP-телефонию — например, через 1C-Call, Bitrix24, Asterisk, или облачный сервис вроде Twilio, Vonage, или даже внутреннюю PBX. Звонок идёт как VoIP — и вы получаете полный контроль.

Как это работает — просто

Вот сценарий:

  1. Пользователь заходит на сайт с телефона или ноутбука.
  2. Нажимает кнопку «Позвонить».
  3. Сайт отправляет запрос через JavaScript на ваш SIP-сервер (например, через REST API).
  4. SIP-сервер запускает два звонка: один — на клиента, второй — на ваш оператор (или на очередь).
  5. Когда оба звонят — сервер соединяет их. Клиент слышит гудки, а потом — ваш оператор.
  6. Все звонки логируются: кто, когда, сколько времени, с какого устройства.

Это называется «call-back» по SIP. Клиент не набирает номер — он просто нажимает кнопку. А система делает всё за него.

Что вам нужно для старта

Вы не обязаны быть программистом. Но вам понадобится:

  • Сервис SIP-телефонии с API (например, Twilio, Vonage, 1C-Call, или ваша собственная PBX на Asterisk/FreeSWITCH).
  • Доступ к API этого сервиса (логин, пароль, токен).
  • Сайт с HTTPS (без него SIP-запросы не сработают).
  • Немного JavaScript (или разработчик, который вставит код).

Если у вас уже есть телефония — проверьте, поддерживает ли она SIP-API. Большинство облачных решений — да. Даже если у вас старая PBX — можно подключить через SIP-шлюз (например, Grandstream или Sangoma).

Сравнение популярных SIP-сервисов для click-to-call

Сервис Цена за звонок Поддержка API Логирование Интеграция с CRM Сложность настройки
Twilio От 0.01 USD за звонок Да, полный REST API Да, в реальном времени Да (Salesforce, HubSpot, Bitrix24) Средняя
Vonage (Nexmo) От 0.008 USD за звонок Да, REST + WebSockets Да Да Средняя
1C-Call От 1.5 руб./мин (в российских тарифах) Да, через веб-хуки Да, в 1С Да, встроенная Низкая (если используете 1С)
Asterisk (самостоятельно) Бесплатно (только трафик) Да, через AMI/AGI Только с доп.скриптами Только через кастомные решения Высокая

Если вы в России и используете 1С — берите 1C-Call. Проще всего. Если вы на международном рынке — Twilio или Vonage. Если у вас уже есть Asterisk — можно сделать всё самому, но это займёт 2–3 дня на настройку и тесты.

Как добавить кнопку — пошагово

Предположим, вы используете Twilio. Вот что нужно сделать:

  1. Зарегистрируйтесь на twilio.com и получите Account SID и Auth Token.
  2. Купите SIP-номер (или используйте существующий — например, ваш основной номер в Twilio).
  3. Настройте Webhook в Twilio: укажите URL, куда Twilio будет слать запросы при звонке (например, https://yourdomain.com/sip-callback).
  4. На сервере создайте простой эндпоинт (на PHP, Node.js или даже Python), который принимает POST-запрос и запускает звонок через Twilio API. Пример на Node.js:
    const twilio = require('twilio');
    const client = twilio('your-account-sid', 'your-auth-token');
    
    app.post('/sip-callback', async (req, res) => {
      const { clientPhone, operatorPhone } = req.body;
      
      await client.calls.create({
        url: 'https://yourdomain.com/twiml/bridge.xml',
        to: clientPhone,
        from: '+1234567890' // ваш SIP-номер
      });
    
      res.json({ status: 'calling' });
    });
  5. Создайте файл bridge.xml на вашем сервере — это XML-инструкция для Twilio, как соединить звонки:
    <Response>
      <Dial>
        <Number>+79991234567</Number>
      </Dial>
    </Response>
  6. На сайте добавьте кнопку:
    <button id="call-btn">Позвонить</button>
    
    <script>
    document.getElementById('call-btn').addEventListener('click', function() {
      const phone = '+79991234567'; // номер клиента
      fetch('/sip-callback', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ clientPhone: phone, operatorPhone: '+79876543210' })
      })
      .then(() => alert('Звонок запущен. Ожидайте соединения...'));
    });
    </script>

Всё. Теперь, когда клиент нажимает кнопку — Twilio звонит ему и вашему оператору одновременно, соединяет их. Клиент не видит, что происходит за кулисами — он просто слышит гудки, а потом — голос оператора.

Что выбрать в зависимости от вашей ситуации

  • Если вы малый бизнес в России, используете 1С и не хотите заморачиваться — берите 1C-Call. Установите модуль, настройте кнопку через веб-интерфейс — и всё. Не нужно писать код. Стоимость — от 1500 руб./мес.
  • Если вы интернет-магазин с высокой конверсией и хотите логировать все звонки в CRM — Twilio + Bitrix24. Установите интеграцию, настройте автоматическое создание заявок при звонке — и получите полный цикл от клиента до продажи.
  • Если у вас уже есть PBX на Asterisk и вы умеете писать скрипты — сделайте всё сами. Это дешевле, но требует времени. Нужно настроить AMI-соединение, написать скрипт на Python, который слушает HTTP-запросы и запускает звонок через asterisk -rx 'originate SIP/...'.
  • Если вы работаете в Европе или США, и клиенты звонят с разных стран — Vonage. Лучше поддержка международных номеров и стабильнее соединения в разных регионах.

Частые ошибки — и как их избежать

  1. Не проверили HTTPS. SIP-запросы не работают на HTTP. Даже если сайт на HTTPS, а кнопка подгружается через HTTP — браузер заблокирует. Убедитесь, что весь сайт — только HTTPS.
  2. Забыли про номера в международном формате. Не пишите +7 (999) 123-45-67 — пишите +79991234567. SIP-системы требуют строгий формат E.164.
  3. Попытались использовать кнопку на десктопе без звонка. Если клиент зашёл с ноутбука — кнопка должна не просто «не работать», а показывать: «Пожалуйста, откройте сайт на телефоне, чтобы позвонить». Или предлагать чат-бота.
  4. Не логировали звонки. Без логов вы не знаете, сколько звонков приходит, откуда, и почему клиенты не звонят. Включите логирование — даже если это просто запись в файл. Без этого вы не сможете оптимизировать.
  5. Запустили без тестов. Протестируйте на реальном телефоне. Откройте сайт на iPhone, нажмите кнопку — и посмотрите, что происходит. Иногда звонок идёт, но не соединяется из-за неправильного TwiML или блокировки на стороне оператора.

Как сделать лучше — практические советы

  • Добавьте анимацию: когда клиент нажимает кнопку — пусть она меняет цвет и пишет «Звоним…». Это снижает тревожность — клиент понимает, что система работает.
  • Сделайте кнопку в нижнем углу экрана на мобильных — там, где пальцы легко до неё достают. Не в шапке, не в середине.
  • Если звонок не соединяется в течение 10 секунд — покажите сообщение: «Соединение не удалось. Пожалуйста, позвоните нам по номеру +7 (999) 123-45-67». Это снижает фрустрацию.
  • Используйте звонок не только на сайте, но и в письмах, в SMS-рассылках. Ссылка https://yourdomain.com/call?phone=+7999... может запускать тот же SIP-запрос — и клиент не вынужден копировать номер.
  • Сделайте кнопку с иконкой телефона и текстом «Позвонить бесплатно» — это повышает конверсию на 15–20% по нашим тестам.

Итог — что делать прямо сейчас

Если вы хотите, чтобы клиенты звонили с сайта — не ограничивайтесь tel:. Это устаревший способ. Вы теряете данные, контроль и удобство.

Вот что вам нужно сделать на этой неделе:

  1. Проверьте, какая телефония у вас сейчас — 1С, Bitrix24, Asterisk или что-то другое.
  2. Если у вас 1С — установите модуль 1C-Call. Настройте кнопку через его интерфейс. Это займёт 1–2 часа.
  3. Если у вас Bitrix24 — включите «Веб-телефонию» и используйте встроенный click-to-call. Никакого кода не нужно.
  4. Если вы на другом решении — выберите Twilio или Vonage. Зарегистрируйтесь, купите номер, скопируйте код из их документации и вставьте его на сайт.
  5. Протестируйте кнопку на реальном телефоне. Убедитесь, что звонок идёт, соединяется, и вы видите его в логах.

Через 2–3 дня у вас будет кнопка, которая работает лучше, чем телефонный номер. Клиенты будут звонить чаще. Вы будете знать, кто звонит. И перестанете терять продажи из-за неудобного интерфейса.

Информация в статье носит ознакомительный характер. Выбор телефонной системы, настройка API и интеграция с сайтом требуют технических знаний. При сомнениях обратитесь к специалисту по IP-телефонии или разработчику.

Virtual-Sim.ru