Twilio 调用被不遵守 Twilio.Device.destroy() 的多个设备实例阻止
Twilio calls blocked by multiple device instances that do not respect Twilio.Device.destroy()
我正在开发一个 Twilio 应用程序,用户将在 public 终端面前看到一个数字列表。有些是 SIP,有些是传统的。最终用户可能会按下按钮呼叫列表中的一个人,进行对话,然后走开——然后另一个用户会走上前去呼叫另一个人。
我遇到了一个问题,即 Twilio.Device.destroy 没有消除所有正在播放的设备,并且示例中的第二个用户最终会调用第一个用户的目标。
首先是代码,然后是日志:
按钮挂钩:
$('.twilio-voice').click(function() {
var toNum = this.value;
console.log('To num in jq');
console.log(toNum);
makeVoiceCall(toNum);
});
makeVoiceCall 函数:
var makeVoiceCall = function(toNum) {
console.log('To Num Is:');
console.log(toNum);
if(localStorage.token == undefined) {
console.log("In If");
getVoiceToken(toNum);
} else {
console.log("In Else");
console.log(localStorage.token);
Twilio.Device.setup(localStorage.token, {debug: true});
Twilio.Device.ready(function(device){
console.log('IN READY TO NUM IS');
console.log(toNum);
Twilio.Device.connect({"To": toNum});
});
Twilio.Device.error(function(error) {
console.log(error.message);
if(error.message == 'JWT Token Expired') {
getVoiceToken(toNum);
};
});
}
};
有一个事件侦听器在 Twilio.Device.connect 上启动模态,它创建一个模态按钮,当按下时,它会创建一个模态按钮和一个断开事件侦听器,这两个事件侦听器都调用挂断函数:
function hangup() {
Twilio.Device.disconnectAll();
Twilio.Device.destroy();
};
我试过添加 Twilio.Device.destroy();在 makeVoiceCall 的开头,在 Twilio.Device.ready() 内;在 else 语句的顶部,它们似乎没有任何效果。如果我单击一个传统号码,然后单击一个 sip 号码,日志如下所示。传统号码被呼叫两次。如果先拨SIP号码,再拨传统号码再拨。在此示例中,当页面加载时,localStorage 中已经有一个令牌。
To num in jq
ts:1214 +15555555555
ts:1178 To Num Is:
ts:1179 +15555555555
ts:1190 In Else
ts:1191
[Whosebug EDIT: console logged token removed]
twilio.min.js:71 Device.sounds is deprecated and will be removed in the next
breaking release. Please use the new functionality available on
Device.audio.
m.defaultWarnHandler @ twilio.min.js:71
m.deprecated @ twilio.min.js:71
(anonymous) @ twilio.min.js:72
l @ twilio.min.js:71
a @ twilio.min.js:39
setup @ twilio.min.js:59
makeVoiceCall @ ts:1192
(anonymous) @ ts:1215
dispatch @ jquery-2.1.3.min.js:3
r.handle @ jquery-2.1.3.min.js:3
twilio.min.js:70 [Device] Setting up PStream
twilio.min.js:70 [WSTransport] Opening socket
twilio.min.js:70 [WSTransport] attempting to connect
twilio.min.js:70 [WSTransport] Socket opened
twilio.min.js:70 [PStream] Setting token and publishing listen
twilio.min.js:70 [Device] Stream is ready
ts:1194 IN READY TO NUM IS
ts:1195 +15555555555
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "have-local-offer"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "stable"
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "checking"
xb @ jquery-2.1.3.min.js:3
get @ jquery-2.1.3.min.js:3
css @ jquery-2.1.3.min.js:3
get @ jquery-2.1.3.min.js:3
cur @ jquery-2.1.3.min.js:3
init @ jquery-2.1.3.min.js:3
Kb @ jquery-2.1.3.min.js:3
createTween @ jquery-2.1.3.min.js:3
Rb.* @ jquery-2.1.3.min.js:3
Ub @ jquery-2.1.3.min.js:3
Vb @ jquery-2.1.3.min.js:3
Xb @ jquery-2.1.3.min.js:3
g @ jquery-2.1.3.min.js:3
dequeue @ jquery-2.1.3.min.js:3
(anonymous) @ jquery-2.1.3.min.js:3
each @ jquery-2.1.3.min.js:2
each @ jquery-2.1.3.min.js:2
queue @ jquery-2.1.3.min.js:3
animate @ jquery-2.1.3.min.js:3
n.fn.(anonymous function) @ jquery-2.1.3.min.js:3
addModal @ ts:974
(anonymous) @ ts:1024
a.emit @ twilio.min.js:162
(anonymous) @ twilio.min.js:48
c @ twilio.min.js:165
a.emit @ twilio.min.js:163
mediaStream.onopen @ twilio.min.js:21
a.version.pc.onsignalingstatechange @ twilio.min.js:119
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "completed"
twilio.min.js:70 [Connection] Disconnecting...
twilio.min.js:70 [PStream] Closing PStream
twilio.min.js:70 [WSTransport] Closing socket
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "closed"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "closed"
twilio.min.js:158 WebSocket connection to 'wss://chunderw-vpc-gll.twilio.com/signal' failed: Close received after close
l._connect @ twilio.min.js:158
l.open @ twilio.min.js:157
a @ twilio.min.js:78
a @ twilio.min.js:75
a._setupStream @ twilio.min.js:54
a.register @ twilio.min.js:50
a @ twilio.min.js:46
setup @ twilio.min.js:59
makeVoiceCall @ ts:1192
(anonymous) @ ts:1215
dispatch @ jquery-2.1.3.min.js:3
r.handle @ jquery-2.1.3.min.js:3
twilio.min.js:70 [WSTransport] Socket received error: undefined
twilio.min.js:70 [WSTransport] Socket closed
twilio.min.js:70 [Device] Stream is offline
ts:1213 To num in jq
ts:1214 sip:test@sipexample.info
ts:1178 To Num Is:
ts:1179 sip:test@sipexample.info
ts:1190 In Else
ts:1191 [Whosebug EDIT: token console.logged]
twilio.min.js:70 [Device] Found existing Device; using new token but ignoring options
twilio.min.js:70 [Device] Setting up PStream
twilio.min.js:70 [WSTransport] Opening socket
twilio.min.js:70 [WSTransport] attempting to connect
twilio.min.js:70 [WSTransport] Socket opened
twilio.min.js:70 [PStream] Setting token and publishing listen
twilio.min.js:70 [Device] Stream is ready
[Whosebug EDIT: HERE IS WHERE TWO DEVICES ARE CALLED BY ONE Twilio.Device.setup()]
ts:1194 IN READY TO NUM IS
ts:1195 +15555555555
ts:1194 IN READY TO NUM IS
ts:1195 sip:test@sipexample.info
twilio.min.js:51 Uncaught Error: A Connection is already active
at a.connect (twilio.min.js:51)
at Function.connect (twilio.min.js:60)
at a.<anonymous> (ts:1196)
at a.emit (twilio.min.js:163)
at a.<anonymous> (twilio.min.js:55)
at a.emit (twilio.min.js:163)
at l.transport.onmessage (twilio.min.js:78)
at WebSocket.c.onmessage (twilio.min.js:160)
a.connect @ twilio.min.js:51
connect @ twilio.min.js:60
(anonymous) @ ts:1196
a.emit @ twilio.min.js:163
(anonymous) @ twilio.min.js:55
a.emit @ twilio.min.js:163
transport.onmessage @ twilio.min.js:78
c.onmessage @ twilio.min.js:160
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "have-local-offer"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "stable"
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "checking"
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "completed"
twilio.min.js:70 [Connection] Disconnecting...
twilio.min.js:70 [PStream] Closing PStream
twilio.min.js:70 [WSTransport] Closing socket
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "closed"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "closed"
twilio.min.js:158 WebSocket connection to 'wss://chunderw-vpc-gll.twilio.com/signal' failed: Close received after close
l._connect @ twilio.min.js:158
l.open @ twilio.min.js:157
a @ twilio.min.js:78
a @ twilio.min.js:75
a._setupStream @ twilio.min.js:54
a.register @ twilio.min.js:50
setup @ twilio.min.js:59
makeVoiceCall @ ts:1192
(anonymous) @ ts:1215
dispatch @ jquery-2.1.3.min.js:3
r.handle @ jquery-2.1.3.min.js:3
twilio.min.js:70 [WSTransport] Socket received error: undefined
twilio.min.js:70 [WSTransport] Socket closed
twilio.min.js:70 [Device] Stream is offline
正如您在日志的底部四分之一看到的那样——由我添加的标记:[Whosebug EDIT: HERE IS WHERE TWO DEVICES ARE CALLED BY ONE Twilio.Device.setup()]
,SIP 和传统号码都在单个 Twilio.Device.setup 呼叫期间被呼叫,即使设备通过挂断功能被破坏(我已经尝试过其他点放置Twilio.Device.destroy)。因此,在第二次尝试时,只有原来呼叫的号码才真正接通。
目前,我能想到的唯一解决方法是为列表中的每个人创建单独的函数(这是 DRY 的对立面,并为维护或扩展此代码增加了大量工作)或者在完成通话后重新加载页面(我的雇主不喜欢)。
如果我可以在调用完成后简单地释放/销毁 Twilio 设备,那将对我有很大帮助。我尝试在 ready 内的 Twilio.Device.connect 调用下方放置一个 Twilio.Device.disconnect(function() { Twilio.Device.disconnectAll(); Twilio.Device.destroy();});
,结果相同。销毁这些多个设备(或重新使用第一个)的任何帮助都是无价的。
这里是 Twilio 开发人员布道者。
您不必在每次调用后销毁 Twilio.Device
。这里实际发生的是,您正在注册多个处理程序,这些处理程序在 Device
变为 ready
时被调用。
我建议稍微重新设计一下。当页面加载时,设置 Twilio 设备。然后侦听离线事件,以便您知道何时重新生成令牌并重新连接到服务。类似于:
function makeVoiceCall(toNum) {
Twilio.Device.connect({"To": toNum});
}
function setupDevice(token) {
Twilio.Device.setup(token, { debug: true });
}
function getVoiceToken(callback) {
$.post('/token', function(data) {
localStorage.token = data.token;
callback(token);
})
}
function init() {
if(localStorage.token == undefined) {
getVoiceToken(function(token){
setupDevice(token)
});
} else {
setupDevice(localstorage.token)
}
// Ready will setup click handlers.
Twilio.Device.ready(function() {
$('.twilio-voice').click(function() {
var toNum = this.value;
makeVoiceCall(toNum);
});
});
// offline will remove click handlers, get a new token and setup the device again
Twilio.Device.offline(function() {
// unregister click handlers for now
$('.twilio-voice').off('click');
getVoiceToken(function(token) {
setupDevice(token);
})
})
}
window.addEventListener('load', init);
我在这里编写了 getVoiceToken
的新版本,以便它 returns 回调中的令牌,我认为这使事情更容易阅读。
如果这有帮助,请告诉我。
我正在开发一个 Twilio 应用程序,用户将在 public 终端面前看到一个数字列表。有些是 SIP,有些是传统的。最终用户可能会按下按钮呼叫列表中的一个人,进行对话,然后走开——然后另一个用户会走上前去呼叫另一个人。
我遇到了一个问题,即 Twilio.Device.destroy 没有消除所有正在播放的设备,并且示例中的第二个用户最终会调用第一个用户的目标。
首先是代码,然后是日志:
按钮挂钩:
$('.twilio-voice').click(function() {
var toNum = this.value;
console.log('To num in jq');
console.log(toNum);
makeVoiceCall(toNum);
});
makeVoiceCall 函数:
var makeVoiceCall = function(toNum) {
console.log('To Num Is:');
console.log(toNum);
if(localStorage.token == undefined) {
console.log("In If");
getVoiceToken(toNum);
} else {
console.log("In Else");
console.log(localStorage.token);
Twilio.Device.setup(localStorage.token, {debug: true});
Twilio.Device.ready(function(device){
console.log('IN READY TO NUM IS');
console.log(toNum);
Twilio.Device.connect({"To": toNum});
});
Twilio.Device.error(function(error) {
console.log(error.message);
if(error.message == 'JWT Token Expired') {
getVoiceToken(toNum);
};
});
}
};
有一个事件侦听器在 Twilio.Device.connect 上启动模态,它创建一个模态按钮,当按下时,它会创建一个模态按钮和一个断开事件侦听器,这两个事件侦听器都调用挂断函数:
function hangup() {
Twilio.Device.disconnectAll();
Twilio.Device.destroy();
};
我试过添加 Twilio.Device.destroy();在 makeVoiceCall 的开头,在 Twilio.Device.ready() 内;在 else 语句的顶部,它们似乎没有任何效果。如果我单击一个传统号码,然后单击一个 sip 号码,日志如下所示。传统号码被呼叫两次。如果先拨SIP号码,再拨传统号码再拨。在此示例中,当页面加载时,localStorage 中已经有一个令牌。
To num in jq
ts:1214 +15555555555
ts:1178 To Num Is:
ts:1179 +15555555555
ts:1190 In Else
ts:1191
[Whosebug EDIT: console logged token removed]
twilio.min.js:71 Device.sounds is deprecated and will be removed in the next
breaking release. Please use the new functionality available on
Device.audio.
m.defaultWarnHandler @ twilio.min.js:71
m.deprecated @ twilio.min.js:71
(anonymous) @ twilio.min.js:72
l @ twilio.min.js:71
a @ twilio.min.js:39
setup @ twilio.min.js:59
makeVoiceCall @ ts:1192
(anonymous) @ ts:1215
dispatch @ jquery-2.1.3.min.js:3
r.handle @ jquery-2.1.3.min.js:3
twilio.min.js:70 [Device] Setting up PStream
twilio.min.js:70 [WSTransport] Opening socket
twilio.min.js:70 [WSTransport] attempting to connect
twilio.min.js:70 [WSTransport] Socket opened
twilio.min.js:70 [PStream] Setting token and publishing listen
twilio.min.js:70 [Device] Stream is ready
ts:1194 IN READY TO NUM IS
ts:1195 +15555555555
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "have-local-offer"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "stable"
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "checking"
xb @ jquery-2.1.3.min.js:3
get @ jquery-2.1.3.min.js:3
css @ jquery-2.1.3.min.js:3
get @ jquery-2.1.3.min.js:3
cur @ jquery-2.1.3.min.js:3
init @ jquery-2.1.3.min.js:3
Kb @ jquery-2.1.3.min.js:3
createTween @ jquery-2.1.3.min.js:3
Rb.* @ jquery-2.1.3.min.js:3
Ub @ jquery-2.1.3.min.js:3
Vb @ jquery-2.1.3.min.js:3
Xb @ jquery-2.1.3.min.js:3
g @ jquery-2.1.3.min.js:3
dequeue @ jquery-2.1.3.min.js:3
(anonymous) @ jquery-2.1.3.min.js:3
each @ jquery-2.1.3.min.js:2
each @ jquery-2.1.3.min.js:2
queue @ jquery-2.1.3.min.js:3
animate @ jquery-2.1.3.min.js:3
n.fn.(anonymous function) @ jquery-2.1.3.min.js:3
addModal @ ts:974
(anonymous) @ ts:1024
a.emit @ twilio.min.js:162
(anonymous) @ twilio.min.js:48
c @ twilio.min.js:165
a.emit @ twilio.min.js:163
mediaStream.onopen @ twilio.min.js:21
a.version.pc.onsignalingstatechange @ twilio.min.js:119
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "completed"
twilio.min.js:70 [Connection] Disconnecting...
twilio.min.js:70 [PStream] Closing PStream
twilio.min.js:70 [WSTransport] Closing socket
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "closed"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "closed"
twilio.min.js:158 WebSocket connection to 'wss://chunderw-vpc-gll.twilio.com/signal' failed: Close received after close
l._connect @ twilio.min.js:158
l.open @ twilio.min.js:157
a @ twilio.min.js:78
a @ twilio.min.js:75
a._setupStream @ twilio.min.js:54
a.register @ twilio.min.js:50
a @ twilio.min.js:46
setup @ twilio.min.js:59
makeVoiceCall @ ts:1192
(anonymous) @ ts:1215
dispatch @ jquery-2.1.3.min.js:3
r.handle @ jquery-2.1.3.min.js:3
twilio.min.js:70 [WSTransport] Socket received error: undefined
twilio.min.js:70 [WSTransport] Socket closed
twilio.min.js:70 [Device] Stream is offline
ts:1213 To num in jq
ts:1214 sip:test@sipexample.info
ts:1178 To Num Is:
ts:1179 sip:test@sipexample.info
ts:1190 In Else
ts:1191 [Whosebug EDIT: token console.logged]
twilio.min.js:70 [Device] Found existing Device; using new token but ignoring options
twilio.min.js:70 [Device] Setting up PStream
twilio.min.js:70 [WSTransport] Opening socket
twilio.min.js:70 [WSTransport] attempting to connect
twilio.min.js:70 [WSTransport] Socket opened
twilio.min.js:70 [PStream] Setting token and publishing listen
twilio.min.js:70 [Device] Stream is ready
[Whosebug EDIT: HERE IS WHERE TWO DEVICES ARE CALLED BY ONE Twilio.Device.setup()]
ts:1194 IN READY TO NUM IS
ts:1195 +15555555555
ts:1194 IN READY TO NUM IS
ts:1195 sip:test@sipexample.info
twilio.min.js:51 Uncaught Error: A Connection is already active
at a.connect (twilio.min.js:51)
at Function.connect (twilio.min.js:60)
at a.<anonymous> (ts:1196)
at a.emit (twilio.min.js:163)
at a.<anonymous> (twilio.min.js:55)
at a.emit (twilio.min.js:163)
at l.transport.onmessage (twilio.min.js:78)
at WebSocket.c.onmessage (twilio.min.js:160)
a.connect @ twilio.min.js:51
connect @ twilio.min.js:60
(anonymous) @ ts:1196
a.emit @ twilio.min.js:163
(anonymous) @ twilio.min.js:55
a.emit @ twilio.min.js:163
transport.onmessage @ twilio.min.js:78
c.onmessage @ twilio.min.js:160
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "have-local-offer"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "stable"
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "checking"
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "completed"
twilio.min.js:70 [Connection] Disconnecting...
twilio.min.js:70 [PStream] Closing PStream
twilio.min.js:70 [WSTransport] Closing socket
twilio.min.js:70 [Twilio.PeerConnection] iceConnectionState is "closed"
twilio.min.js:70 [Twilio.PeerConnection] signalingState is "closed"
twilio.min.js:158 WebSocket connection to 'wss://chunderw-vpc-gll.twilio.com/signal' failed: Close received after close
l._connect @ twilio.min.js:158
l.open @ twilio.min.js:157
a @ twilio.min.js:78
a @ twilio.min.js:75
a._setupStream @ twilio.min.js:54
a.register @ twilio.min.js:50
setup @ twilio.min.js:59
makeVoiceCall @ ts:1192
(anonymous) @ ts:1215
dispatch @ jquery-2.1.3.min.js:3
r.handle @ jquery-2.1.3.min.js:3
twilio.min.js:70 [WSTransport] Socket received error: undefined
twilio.min.js:70 [WSTransport] Socket closed
twilio.min.js:70 [Device] Stream is offline
正如您在日志的底部四分之一看到的那样——由我添加的标记:[Whosebug EDIT: HERE IS WHERE TWO DEVICES ARE CALLED BY ONE Twilio.Device.setup()]
,SIP 和传统号码都在单个 Twilio.Device.setup 呼叫期间被呼叫,即使设备通过挂断功能被破坏(我已经尝试过其他点放置Twilio.Device.destroy)。因此,在第二次尝试时,只有原来呼叫的号码才真正接通。
目前,我能想到的唯一解决方法是为列表中的每个人创建单独的函数(这是 DRY 的对立面,并为维护或扩展此代码增加了大量工作)或者在完成通话后重新加载页面(我的雇主不喜欢)。
如果我可以在调用完成后简单地释放/销毁 Twilio 设备,那将对我有很大帮助。我尝试在 ready 内的 Twilio.Device.connect 调用下方放置一个 Twilio.Device.disconnect(function() { Twilio.Device.disconnectAll(); Twilio.Device.destroy();});
,结果相同。销毁这些多个设备(或重新使用第一个)的任何帮助都是无价的。
这里是 Twilio 开发人员布道者。
您不必在每次调用后销毁 Twilio.Device
。这里实际发生的是,您正在注册多个处理程序,这些处理程序在 Device
变为 ready
时被调用。
我建议稍微重新设计一下。当页面加载时,设置 Twilio 设备。然后侦听离线事件,以便您知道何时重新生成令牌并重新连接到服务。类似于:
function makeVoiceCall(toNum) {
Twilio.Device.connect({"To": toNum});
}
function setupDevice(token) {
Twilio.Device.setup(token, { debug: true });
}
function getVoiceToken(callback) {
$.post('/token', function(data) {
localStorage.token = data.token;
callback(token);
})
}
function init() {
if(localStorage.token == undefined) {
getVoiceToken(function(token){
setupDevice(token)
});
} else {
setupDevice(localstorage.token)
}
// Ready will setup click handlers.
Twilio.Device.ready(function() {
$('.twilio-voice').click(function() {
var toNum = this.value;
makeVoiceCall(toNum);
});
});
// offline will remove click handlers, get a new token and setup the device again
Twilio.Device.offline(function() {
// unregister click handlers for now
$('.twilio-voice').off('click');
getVoiceToken(function(token) {
setupDevice(token);
})
})
}
window.addEventListener('load', init);
我在这里编写了 getVoiceToken
的新版本,以便它 returns 回调中的令牌,我认为这使事情更容易阅读。
如果这有帮助,请告诉我。