如何检查 Twilio.Device 处理程序是否已经存在

Question

我在 Angular 应用程序中使用 Twilio。每当用户访问某个页面（我们称之为客户页面）时，我都会初始化 Twilio 设备，以便用户可以呼叫特定客户。在客户控制器中调用此初始化函数：

function _initializeDevice(token, connectHandler, disconnectHandler) {
    console.log('CALLED INITIALIZE DEVICE');
    var device = Twilio.Device;
    device.setup(token, {debug: true});
    console.log(device);

    device.connect(connectHandler);
    device.disconnect(disconnectHandler);

    device.offline(function() {
        _getToken().then(function(result) {
            device.setup(result.data.token, {debug: true});
        });
    });

    device.error(_handleTwilioError);
}

这是上面传入的断开连接处理程序：

function onDisconnect() {
    console.log('SAVING CALL');
    // code to save call
}

问题是，每当用户离开客户页面并返回（不刷新页面）时，客户控制器再次运行s，导致 _initializeDevice 功能也运行再次。多个 connect/disconnect/etc。处理程序最终注册到同一个设备，这导致应该只运行一次到运行多次。

这是我的控制台日志示例，用于说明问题...

下面是我 第一次 转到客户页面并第一次调用 _initializeDevice 时发生的情况：

CALLED INITIALIZE DEVICE
[Device] Setting up PStream
[WSTransport] Opening socket
[WSTransport] attempting to connect
[WSTransport] Socket opened
[PStream] Setting token and publishing listen
[Device] Stream is ready
[Device] Found existing Device; using new token but ignoring options
[PStream] Setting token and publishing listen
[Twilio.PeerConnection] signalingState is "have-local-offer"
[Twilio.PeerConnection] signalingState is "stable"
[Twilio.PeerConnection] iceConnectionState is "checking"
[Twilio.PeerConnection] iceConnectionState is "connected"
[Twilio.PeerConnection] iceConnectionState is "completed"
[Connection] Disconnecting...
[Twilio.PeerConnection] iceConnectionState is "closed"
[Twilio.PeerConnection] signalingState is "closed"
SAVING CALL

然后我离开客户页面并再次返回，没有刷新，所以控制器再次运行s 初始化代码并复制处理程序：

CALLED INITIALIZE DEVICE
[Device] Found existing Device; using new token but ignoring options
[PStream] Setting token and publishing listen
CALLED INITIALIZE DEVICE
[Device] Found existing Device; using new token but ignoring options
[PStream] Setting token and publishing listen
[Device] Found existing Device; using new token but ignoring options
[PStream] Setting token and publishing listen
[Twilio.PeerConnection] signalingState is "have-local-offer"
[Twilio.PeerConnection] signalingState is "stable"
[Twilio.PeerConnection] iceConnectionState is "checking"
[Twilio.PeerConnection] iceConnectionState is "connected"
[Twilio.PeerConnection] iceConnectionState is "completed"
[Connection] Received HANGUP from gateway
[Connection] Disconnecting...
[Twilio.PeerConnection] iceConnectionState is "closed"
[Twilio.PeerConnection] signalingState is "closed"
SAVING CALL
SAVING CALL
SAVING CALL

我尝试使用Twilio.Device.destroy()，但处理程序仍然存在。

如何检查处理程序是否已附加到 Twilio 设备？或者，我是否应该在我的 Angular 应用程序的其他地方附加事件处理程序？

编辑：供参考，这是我断开通话的方式（附在按钮上）：

function hangUp() {
    Twilio.Device.disconnectAll();
}

Answer 1

如果在调用 Device.destroy() 之后调用 Twilio.Device.destroy() your handlers are not being unregistered, you may be experiencing token expiration issues because you need to call Device.setup() with a new token 以便再次使用设备。

确保连接终止的另一种方法是调用 Twilio.Device.disconnectAll();。也许您的处理函数实际上并未处理终止。

请告诉我检查您的令牌设置后情况如何，并提供任何相关的日志信息以帮助我更清楚地了解问题。

Answer 2

Twilio.Device 目前不支持注销监听器。似乎这是由于它的单例行为。这在未来可能会改变，但现在您可以为您绑定的每个事件使用以下命令直接删除侦听器：

Twilio.Device.instance.removeListener('eventName', handlerFn);

注意不要 removeAllListeners，因为 Device 实例正在侦听它自己的一些事件。

如何检查 Twilio.Device 处理程序是否已经存在

How to check if Twilio.Device handlers already exist

javascript

twilio

angularjs

twilio-click-to-call