服务器端事件和Ajax请求

使用PHP和JavaScript我试图向我的网站添加一个按钮，它将“恢复”数据的实时提要。我可以成功'停止'饲料，我只是努力再次开始。服务器端事件和Ajax请求

当我停止供稿时，我保存来自服务器的lastEventId。当我点击开始按钮时，我重新使用这个值并向服务器发送一个AJAX请求。这工作，我能够检索lastEventId。

我需要一些帮助从停止的地方再次启动Feed。

我的JS code;

<script type="text/javascript"> 
     $("document").ready(function(){ 
      var lastSerial; 
      var source = new EventSource("data.php"); 

      source.onmessage = function(event) { 
       lastSerial = event.lastEventId; 
       document.getElementById("result").innerHTML += "New transaction: " + event.data + "<br>"; 
       console.log(event.lastEventId); // returns the `lastEventId` 
      }; 
      $("#start").click(function(){ 
       $.ajax({ 
        type: "POST", 
        url: 'data.php', 
        data: {lastSerial: lastSerial}, 
        success: function(data){ 
         // need to start the feed again here from where it left off, based on the returned `lastSerial` value 
         console.log(lastSerial) // returns an INT as expected 
        } 
       }); 
      }); 
      $("#stop").click(function(){ 
       source.close(); 
      }); 
     });//end dom ready 
</script> 

<div id="result"><!--live feed here--></div> 
<button id="stop"> stop</button> 
<button id="start"> start</button>

我data.php（简化的）;

if(isset($_POST['lastSerial'])) { 
    // SELECT TimeStamp, SerialNo ... WHERE SerialNo >= 'lastSerial' ... 
    // fetch results 
    // echo "data: " .$row["SerialNo"]. "\n\n"; 
}

因此，我可以成功地停止饲料。当我点击开始时，lastSerial被记录到控制台。

任何意见表示赞赏。

来源

2017-08-14 TheOrdinaryGeek

而不是在做source.close()使用一个标志来确定饲料是否已停止。

var is_stopped = false; 

[...] 

$("#stop").click(function(){ 
    is_stopped = true; 
});

然后，

source.onmessage = function(event) { 
    /** If it is NOT stopped. **/ 
    if (!is_stopped) { 
     lastSerial = event.lastEventId; 
     document.getElementById("result").innerHTML += "New transaction: " + event.data + "<br>"; 
     console.log(event.lastEventId); // returns the `lastEventId` 
    } 
};

或者，

source.onmessage = function(event) { 
    /** If it IS stopped. **/ 
    if (is_stopped) 
     return false; 

    lastSerial = event.lastEventId; 
    document.getElementById("result").innerHTML += "New transaction: " + event.data + "<br>"; 
    console.log(event.lastEventId); // returns the `lastEventId` 
};

这样，你实际上并没有杀害事件，所以当你要重新启动刚才设置is_stopped到false饲料一切都像以前一样恢复。

来源

2017-08-14 12:02:59 Script47

@TheOrdinaryGeek在这种情况下，你可以用'is_stopped'来实际输出数据。所以你会拥有它，但没有实际显示它。如果这个答案对你有帮助，考虑接受它。 – Script47

@TheOrdinaryGeek是的，您可以使用localStorage并将其作为JSON对象存储，如果需要的话可以在恢复时进行检索和比较。 – Script47

Thanks @ Script47这是我目前正在努力工作的部分。我相信我最终会到达那里：/ – TheOrdinaryGeek

服务器端事件和Ajax请求

回答

相关问题