jssip3.9.1的demo，webphone网页电话
用的目前最新的3.9.1版本，全版本在这里：
https://jssip.net/download/releases/
https://github.com/versatica/JsSIP
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<head>
<script src="./jssip.min.js"></script>
<script>
var ___phone = null;
var ___session = null;
// 注册软电话,登录（建立与服务器的socket连接）
function startPhone() {
var socket = new JsSIP.WebSocketInterface('wss://sip.myhost.com');
var configuration = {
sockets: [socket],
uri: 'sip:alice@example.com',
password: 'superpassword'
};
___phone = new JsSIP.UA(configuration);
setUAEvent();
___phone.start();
}
// 登出
function logout() {
if (___phone) {
___phone.unregister(); // 注销
___phone.stop({ register: true });
}
}
// 初始化会话id
function init() {
___session = null;
}
// 绑定ua事件
function setUAEvent(ua) {
// ws 开始尝试连接
___phone.on('connecting', (args) => {
console.log('ws尝试连接');
});
// ws 连接完毕
___phone.on('connected', () => {
console.log('ws连接完毕');
});
// ws 连接失败
___phone.on('disconnected', () => {
console.log('ws连接失败');
})
// SIP 注册成功
___phone.on('registered', e => {
console.log('SIP注册成功')
});
// SIP 注册失败
___phone.on('registrationFailed', e => {
console.log('SIP注册失败')
});
// SIP 取消注册
___phone.on('unregistered', e => {
console.log('SIP主动取消注册或注册后定期重新注册失败')
});
// IM消息 事件
___phone.on('newMessage', e => console.log('im新消息事件'));
// 来电或者外呼事件
___phone.on('newRTCSession', e => {
console.log(`新的${e.originator === 'local' ? '外呼' : '来电'}`, e);
const session = e.session;
___session = session;
const peerconnection = session.connection;
console.log(e)
if (e.originator === 'local') {
peerconnection.addEventListener('addstream', (event) => {
const audio = document.getElementById('remoteAudio');
audio.srcObject = event.stream;
});
} else {
const callers = session.remote_identity.uri.user;
}
// 接听失败
session.on('failed', mdata => {
init();
console.log('来电的时候 拒接或者 还没接听对方自己就挂断了');
});
// 接听成功
session.on("accepted", (response, cause) => {
console.log('接听成功')
});
// 接听成功后 挂断
session.on('ended', () => {
console.log('接听结束');
init();
});
// 通话被挂起
session.on('hold', (data) => {
const org = data.originator;
if (org === 'local') {
console.log('通话被本地挂起:', org);
} else {
console.log('通话被远程挂起:', org);
}
});
// 通话被继续
session.on('unhold', (data) => {
const org = data.originator;
if (org === 'local') {
console.log('通话被本地继续:', org)
} else {
console.log('通话被远程继续:', org);
}
});
});
}
// 接听
function answer() {
___session.answer({
media: {
constraints: {
audio: true,
video: false
},
render: {
remote: document.querySelector('.audio'),
}
}
})
}
// 挂断
function hangUp() {
if (___session && ___session.isEnded() === false) {
___session.terminate();
}
___session = null;
}
// 挂起
function hold() {
___session.hold({ useUpdate: false });
}
// 继续
function unhold() {
___session.unhold({ useUpdate: false });
}
// 一定等到页面加载OK之后
window.onload = function () {
startPhone();
}
// 发起呼叫（注册打电话的回调事件）
function callNumber(phoneNumber) {
var eventHandlers = {
progress(e) {
console.log('正在呼叫:', e);
},
failed(e) {
console.log('呼叫失败: ', e);
},
ended(e) {
console.log('呼叫结束:' + e.originator === 'remote' ? '对方挂断' : '自己挂断', e);
},
confirmed(e) {
console.log('呼叫接受' + e.originator === 'remote' ? '自己已接受' : '对方已接受', e);
}
};
const options = {
eventHandlers: eventHandlers,
mediaConstraints: { 'audio': true, 'video': false }
};
___phone.call(`sip:${phoneNumber}`, options);
}
</script>
</head>
<body>
<!-- 媒体播放dom树 -->
<audio id='remoteAudio' autoPlay></audio>
<!-- 发起呼叫 -->
<button onclick="callNumber('17600427676')">拨打</button>
</body>
参考自：https://www.cnblogs.com/dingshaohua/p/15137584.html
