Пример Click to Call
Данный пример позволяет сделать аудиозвонок одним кликом кнопки, используя аккаунт, заданный в файле настроек сервера
/usr/local/FlashphonerWebCallServer/conf/apps/click-to-call/accounts.xml
Код примера
Код данного примера находится на WCS-сервере по следующему пути:
/usr/local/FlashphonerWebCallServer/client2/examples/demo/sip/click-to-call
click-to-call.html - страница примера
click-to-call.js - скрипт, обеспечивающий работу примера
Тестировать данный пример можно по следующему адресу:
https://host:8888/client2/examples/demo/sip/click-to-call/click-to-call.html
Здесь host - адрес WCS-сервера.
Работа с кодом примера
Для разбора кода возьмем версию файла click-to-call.js с хешем 26fc5afa246baea80867fa011305da811edab1f0, которая находится здесь и доступна для скачивания в соответствующей сборке 0.5.5.1894.
1. Инициализация API.
Flashphoner.init() код
Code Block | ||
---|---|---|
| ||
Flashphoner.init({flashMediaProviderSwfLocation: '../../../../media-provider.swf'}); |
2. Подключение к серверу.
createSession() код
Методу createSession() передается объект с параметрами для подключения
- urlServer - URL для WebSocket-соединения с WCS-сервером
- appKey - внутреннее серверное приложение 'clickToCallApp'
Параметры для SIP-соединения берутся из файла настроек accounts.xml.
Code Block | ||
---|---|---|
| ||
var url = $('#urlServer').val();
var appKey = "clickToCallApp";
var connectionOptions = {
urlServer: url,
appKey: appKey
};
//create session
console.log("Create new session with url " + url);
Flashphoner.createSession(connectionOptions).on(SESSION_STATUS.ESTABLISHED, function(session){
setStatus("Session", SESSION_STATUS.ESTABLISHED);
//session connected, place call
call(session);
}).on(SESSION_STATUS.DISCONNECTED, function(){
setStatus("Session", SESSION_STATUS.DISCONNECTED);
onHangup();
}).on(SESSION_STATUS.FAILED, function(){
setStatus("Session", SESSION_STATUS.FAILED);
onHangup();
}); |
3. Получение от сервера события, подтверждающего успешное соединение.
ConnectionStatusEvent ESTABLISHED код
При обработке данного события создается исходящий звонок
Code Block | ||
---|---|---|
| ||
Flashphoner.createSession(connectionOptions).on(SESSION_STATUS.ESTABLISHED, function(session){
setStatus("Session", SESSION_STATUS.ESTABLISHED);
//session connected, place call
call(session);
}).on(SESSION_STATUS.DISCONNECTED, function(){
setStatus("Session", SESSION_STATUS.DISCONNECTED);
onHangup();
}).on(SESSION_STATUS.FAILED, function(){
setStatus("Session", SESSION_STATUS.FAILED);
onHangup();
}); |
4. Исходящий звонок.
session.createCall(), call() код
При создании в метод передаются следующие параметры
- callee - SIP имя пользователя вызываемого
- visibleName - отображаемое имя
- localVideoDisplay - div-элемент локального дисплея (в случае Flash медиа-провайдера будет использован для диалога настроек Flash-плеера)
- remoteVideoDisplay - div-элемент для получаемого аудио
- constraints - ограничения для звонка (в данном случае параметр 'video' установлен в 'false' для аудиозвонка)
- receiveAudio - установлен в 'true' для получения аудио
- receiveVideo - установлен в 'false', чтобы не получать видео
Code Block | ||
---|---|---|
| ||
var constraints = {
audio: true,
video: false
};
//prepare outgoing call
var outCall = session.createCall({
callee: $("#callee").val(),
visibleName: "Click To Call",
localVideoDisplay: localDisplay,
remoteVideoDisplay: remoteDisplay,
constraints: constraints,
receiveAudio: true,
receiveVideo: false
}).on(CALL_STATUS.RING, function(){
setStatus("Call", CALL_STATUS.RING);
}).on(CALL_STATUS.ESTABLISHED, function(){
setStatus("Call", CALL_STATUS.ESTABLISHED);
}).on(CALL_STATUS.FINISH, function(){
setStatus("Call", CALL_STATUS.FINISH);
onHangup();
}).on(CALL_STATUS.FAILED, function(){
setStatus("Call", CALL_STATUS.FAILED);
onHangup();
});
outCall.call(); |
5. Завершение звонка.
call.hangup() код
Code Block | ||
---|---|---|
| ||
$("#callBtn").text("Hangup").removeClass("btn-success").addClass("btn-danger").off('click').click(function(){
$(this).prop('disabled', true);
outCall.hangup();
}).prop('disabled', false); |