Question

我正在使用一个Web应用程序来控制使用openHab API和使用SSE的灯光，但是当灯亮起时我同时收到了3条消息

值为100的一个以及另外两个与灯光实际值相同的信息（ex 45）该值对应于光的亮度％

eventSource.onmessage = (event: any) => {
      this.val = JSON.parse(JSON.parse(event.data).payload).value;
      console.log("new val " + this.val);
      slid.value = this.val;
      if(this.val >= 1){
        this.light = true;
        button.checked= true;
      }
      else{
        this.light = false;
        button.checked = false;
      }
    };

问题在于我的进度条显示灯光在哪里变为100％然后下降到它应该的值，我想避免这有任何阻止消息或仅更新值的事情收到的最后一条消息？

感谢。

Answer 1

如果我们假设这是服务器端的错误或网络问题，您可以通过在执行任何操作之前添加0.1秒等待来解决此问题。然后，如果三个消息同时到达，则只有第三个消息将触发任何UI更改。大致相同（未经测试的代码，this.light中的changeUI()肯定需要整理出来）：

var timer = null;

eventSource.onmessage = (event: any) => {
      this.val = JSON.parse(JSON.parse(event.data).payload).value;
      console.log("new val " + this.val);
      if(timer)clearTimeout(timer);
      timer = setTimeout(changeUI, 100, this.val);
      };

function changeUI(val){
    if(timer){clearTimeout(timer);timer=null;}   //Redundant but harmless
    slid.value = val;
    if(val >= 1){
        this.light = true;
        button.checked= true;
      }
    else{
        this.light = false;
        button.checked = false;
      }
    }

多次为同一事件服务器发送事件接收消息

1 个答案: