如何将状态更改事件与用户操作结合起来答案

【问题标题】：How to combine status change event with the user action如何将状态更改事件与用户操作结合起来
【发布时间】：2020-03-09 13:54:10
【问题描述】：

我正在使用一个第三方 js 库来实现 VoIP 功能。该库基于 WebSocket 事件进行连接、断开、拨打电话等。

现在，问题是将状态事件与操作绑定。

例如，这里是连接到 VoIP 服务器的代码

var VoIP = create({
        call: {
            callDefaults: {
                sendInitialVideo: false
            }
        },
        logs: {
            logLevel: "SILENT"
        },
        authentication: {
            subscription: {
                server: "spidr-ucc.genband.com"
            },
            websocket: {
                server: "spidr-ucc.genband.com"
            }
        }
    });

为了监听事件让我们说一个连接，有一个事件监听器

VoIP.on("call:stateChange", function (params) {



});

在 HTML 页面上有一个按钮，如果用户单击该按钮，API 会尝试建立连接。

<button id="makeConnection" value="connect" />

$("#makeConnection").on("click",function(){

     doConnect();

});

function doConnect(){

  VoIP.connect({
          username: username,
          password: password
 });
}

现在，我想对它进行编程，当用户单击按钮时，它将调用VoIP.connect API 并将状态返回为callback 或then。

所以，在$("makeConnection") 函数中，我想要类似的东西，它可以建立连接并返回状态，这样我就不必管理状态更改并以不同的方式进行连接操作。

doConnect().Onstate(function(status){


});

【问题讨论】：

call:stateChange 多久触发一次？如果多次，则不能使用 Promise。（或者只等到第一个事件 - 在 .on() 旁边应该有类似 .once() 的方法）
call:stateChanges 为不同或相同的事件多次调用，例如，如果我们拨打电话，它会触发，如果我们将呼叫搁置，它会触发。我尝试过承诺，但正如你所说，它只会着火一次。
是的，在这种情况下，承诺不是你的选择。看看我下面的答案，它应该允许你想象的电话。但是请注意，您现在不应重复 doConnect().Onstate(…) 调用，否则会在同一个 VoIP 实例上安装多个事件侦听器。
实际上所有事件都通过stateChange 流动，因此我想我们需要隔离 VoIP.on 以便对于其他事件，如通话中，搁置它不会重新注册

标签： javascript jquery promise callback

【解决方案1】：

只需让doConnect 使用您要调用的onState 方法返回一个对象：

function doConnect(){
    VoIP.connect({
        username: username,
        password: password
    });
    return {
        onState(callback) {
            VoIP.on("call:stateChange", callback);
        }
    };
}

【讨论】：

取消注册事件一旦被触发会怎样？比如` VoIP.on("call:stateChange", function(){ $(this}.off(); callback(););`
@Hunt 鉴于您尚未链接 VoIP 文档，我不知道您可以这样做。当然，如果您只想等待第一个事件，那么即使是 Promise 方法也是可能的。
这里是我们使用的SDK链接https://kandy-io.github.io/kandy-link-js-sdk-3.x/docs