7992 подписчика

WEB – callback на Asterisk своими руками

22 ноября 201822 ноя 2018

295

6 мин

Оглавление

PREREQUISITES
НАСТРОЙКА СКРИПТОВ

Коллбэк сервисы созданы для роста звонков. Предлагая перезвонить, вы создаете комфортные для клиента условия потенциального диалога, и, как следствие – продажи. Исследования показывают, что наличие callback на сайте обеспечивает до 10% рост звонков.

В статье мы хотим рассказать, как сделать callback сервис на вашем сайте с помощью IP – АТС Asterisk не прибегая к оплате услуг популярных сервисов – то есть бесплатно. Какие плюсы показанного ниже решения мы бы хотели отметить:

Дизайн шаблона - сам HTML – темплейт использует простой CSS - дизайн в двухцветной гамме. Меняйте цвета и сделайте шаблон гармоничным для своего сайта, чтобы не вызвать у клиента диссонанс и отторжение;
Время перезвона - по нашим подсчетам, обещать клиенту перезвон через 10 секунд вполне реально. Правда, это в случае, если оператор не занят (вы можете кидать вызов на группу) ;

Приступаем к настройке?

PREREQUISITES

На нашем лабораторном стенде, в рамках которого была написана эта статья, соблюдены следующие условия:

WEB – сервер, на котором развернут сайт имеет сетевую связность с сервером IP – АТС Asterisk и находится в рамках одной сети (VLAN);

WEB – сервер поддерживает PHP и Javascript;

Если ваш web – сайт находится на платном хостинге, то в файл callback.js в параметре URL вы можете указать внешний линк на callback.php файл, например путем проброса портов (внешний_IP:порт/callback.php). Важно отметить, что мы не рекомендуем такой путь, так как это не безопасно.

Предварительно, нам необходимо настроить AMI (Asterisk Manager Interface). Подключаемся по SSH к серверу IP – АТС Asterisk и открываем файл настройки AMI:

vim /etc/asterisk/manager.conf

Далее проверяем, чтобы в секции [general] у нас было выставлено enabled = yes и остальные параметры, как показано ниже:

[general]
enabled = yes
port = 5038
bindaddr = 0.0.0.0
displayconnects=no ;only effects 1.6+

Добавляем нового пользователя. Для этого, в открытый файл внесите следующую конструкцию:

[имя_пользователя]
secret = пароль
deny=0.0.0.0/0.0.0.0
permit=192.168.1.7/255.255.255.255
read = system,call,log,verbose,command,agent,user,config,command,dtmf,reporting,cdr,dialplan,originate,message
write = system,call,log,verbose,command,agent,user,config,command,dtmf,reporting,cdr,dialplan,originate,message

Вам нужно поменять следующие параметры:

имя_пользователя - создайте имя для юзера. У нас будет callback;
пароль - создайте криптостойкий пароль, с помощью сервисов онлайн генерации, например. В нашей лабы мы сделали простой пароль – P@ssword;
permit - укажите вашу подсеть. В указанной подсети должен находится IP – адрес, с которого скрипт будет обращаться к AMI. Наш скрипт будет расположен на самом хосте Asterisk, поэтому, мы указываем его IP (192.168.1.7/32);

НАСТРОЙКА СКРИПТОВ

В схеме будет участвовать 3 файла:

index.php - файл, в котором будет содержаться наша форма (HTML + CSS). Файл находится на web - сервере;
callback.js - небольшой javascript, который будет возвращать сообщение о вызове абоненту или об ошибке. Файл находится на web - сервере;
callback.php - php скрипт, который будет лезть в AMI Asterisk и кидать Originate для коллбэка;

Предварительно, откройте консоль сервера и создайте директорию, в которой будет храниться файл callback.php:

mkdir /var/www/html/callback

Теперь формируем файл callback.php (комментарии по коду):

<?php
$strhost = "192.168.1.7"; # укажите IP – адрес вашего Asterisk. Либо localhost/127.0.0.1, если скрипт загружен на сервер Asterisk;
$strport = "5038"; # AMI - порт, как настроено в секции [general] файла manager.conf;
$timeout = "10";
$num = $_POST[<phone<]; # получаем номер абонента, который хочет получить callback;
$name = <Callback - <.$_POST[<name<].<<; # формируем строку, которую будем выводить на дисплей оператору, который будет осуществлять коллбэк. Она будет состоять из двух параметров: 1 – callback, чтобы оператор понял, что это не входящая, а потенциально исходящая активность и 2 – имя абонента;
$cid = "111"; # экстеншен оператора;
$c="from-internal";
$p="1";
$errno=0 ;
$errstr=0 ;
$sconn = fsockopen($strhost, $strport, &$errno, &$errstr, $timeout) or die("Connection to $strhost:$strport failed");
if (!$sconn) { echo "$errstr ($errno)
\n"; }
else {
echo <OK<;
fputs($sconn, "Action: login\r\n");
fputs($sconn, "Username: callback\r\n"); # укажите имя созданного пользователя в файле manager.conf вместо callback;
fputs($sconn, "Secret: P@ssw0rd\r\n"); # укажите пароль созданного пользователя в файле manager.conf вместо P@ssw0rd;
fputs($sconn, "Events: off\r\n\r\n");
usleep(500);
fputs($sconn, "Action: Originate\r\n");
fputs($sconn, "Channel: SIP/$cid\r\n");
fputs($sconn, "Callerid: $name\r\n");
fputs($sconn, "Timeout: 15000\r\n");
fputs($sconn, "Context: $c\r\n");
fputs($sconn, "Exten: $num\r\n");
fputs($sconn, "Priority: $p\r\n");
fputs($sconn, "Async: yes\r\n\r\n" );
fputs($sconn, "Action: Logoff\r\n\r\n");
usleep (500);
$wrets=fgets($sconn,128);
fclose($sconn);
exit;
}
?>

После того как скачаете файл по ссылке ниже, измените его расширение с .txt на .php;

СКАЧАТЬ CALLBACK.PHP

Сохраните файл и загрузите его в директорию /var/www/html/callback. Теперь переходим в консоль сервера IP – АТС Asterisk и даем следующие команды:

chmod 755 /var/www/html/callback/callback.php
dos2unix /var/www/html/callback/callback.php

Теперь подключаемся к веб – серверу (хостингу). У нас у web – сервера IP – адрес 192.168.1.8. Формируем файл callback.js:

jQuery(document).ready(function($) {
$("#contact").submit(function() {
var str = $(this).serialize();
var delay = 3000;
$.ajax({
type: "POST",
url: "http://192.168.1.7/callback/callback.php",
data: str,
success: function(msg) {
if(msg == <OK<) {
result = <Уже звоним :)<;
} else {
result = msg;
}
$(<#note<).html(result);
}
});
return false;
});
});

Обратите внимание на параметр url: "http://192.168.1.7/callback/callback.php", . Вам нужно заменить IP – адрес на адрес вашего Asterisk.

После того как скачаете файл по ссылке ниже, измените его имя с callbackjs на callback, а расширение с .txt на .php;

СКАЧАТЬ CALLBACK.JS

Загружаем файл в директорию /callback в корне веб – сервера. Двигаемся вперед. Формируем файл формы. Ниже мы приведем только HTML код, без CSS, так как это сильно увеличит длину статьи. Полную версию файла вы можете скачать по ссылке, которая будет после кода:

В корне WEB – сервера создайте директорию callback. Туда загрузить сформированный ранее callback.js и скачайте в интернете jquery-1.11.3.min.js – он так же необходим для корректной работы. Форма следующая:

<script type="text/javascript" src="//merionet.ru/callback/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="//merionet/callback/callback.js"></script>
<div class="container">
<form id="contact" action="">
<h3>Давайте поговорим?</h3>
<h4>Перезвоним через 10 секунд.</h4>
<div id="note"></div>
<fieldset>
<input placeholder="Ваше имя" type="text" name="name">
</fieldset>
<fieldset>
<input id="phone" placeholder="Номер телефона в формате 89123456789" type="text" name="phone">
</fieldset>
<fieldset>
<button type="submit" name="submit" id="contact-submit">Жду звонка!</button>
</fieldset>
</form>
</div>

После того как скачаете файл по ссылке ниже, измените его расширение с .txt на .php;

СКАЧАТЬ INDEX.PHP

Кидаем файл index.php в директорию /callback в корне веб – сервера.

Итак, подводим итоги. У нас имеется:

Файл callback.php загружен в директорию /var/www/html/callback на сервере IP – АТС Asterisk;
Файл callback.js загружен в директорию /callback в корне web - сервера;
Файл index.php загружен в директорию /callback в корне web - сервера;

Выполняем проверку. Перехожим на URL формы и указываем контактные данные: