javascript - Playframework Comet 套接字在客户端捕获断开连接

Question

所以我正在实现一个需要将消息实时发送到浏览器的应用程序。目前这工作正常。当我收到一条消息时，我会看到一个类似于时钟示例的无类型 Actor。

我的问题是，当 cometd 套接字断开连接时，我希望能够重新连接网页。目前，在带有 cometd 插槽的 Chrome 中，加载图标不断旋转。有没有办法捕获 iframe/comet 套接字的断开消息？或者我可以在 javascript/jquery 中轮询什么东西？那么我可以重新加载页面吗？

Answer 1

如果你想重新连接“网页”(换句话说，让你的浏览器向服务器发送另一个请求，使用window.location.reload()或其他方法)，标准play.libs.Comet.onDisconnected handler 对你没有用 - 它的域是服务器端，而不是客户端。

为了让您的客户端自行管理可能的停电，您可能需要实现“心跳”方案。当自上一条消息以来已经过了太多时间时，客户端应用程序将对您的服务器执行 ping 操作。一种可能的方法是:

var CometProcessor = {
  processMessage:         function(message) {
    console.log(message);
  },
  handleHeartbeatTimeout: function() {
    alert('Heartbeat process timeout');
  },
  handleHeartbeatError: function() {
    alert('Heartbeat process error');
  },

  timeoutPeriod:  10000,      // in milliseconds
  timeoutId:      0,          // will contain an ID of the current 'checking' timeout
  checkHandler:   null,       // will contain a link to XHR object

  checkBeat: function() {
    // storing the reference to created XHR object:
    this.checkHandler = $.ajax({
      url:     your_server_url,
      // set it to the URL of ping script, that will respond instantly

      timeout:     1000,
      // this is configurable, but obviously it makes little sense setting this param
      // higher than `timeoutPeriod`

      success:     $.proxy(function() {
        // so this particular heartbeat request check went through ok,
        // but the next may not be so lucky: we need to schedule another check
        this.timeoutId = window.setTimeout(
          $.proxy(this.checkBeat, this), this.timeoutPeriod);
      }, this),

      error:       $.proxy(function(x, t) {
        if (t === 'timeout') {
          this.handleHeartbeatTimeout();
        }
        else {
          this.handleHeartbeatError();
        }
      }, this)
    });
  },

  message: function(message) {
    // when we receive a message, link is obviously functioning,
    // so we need to stop all the checking procedures
    if (this.checkHandler) {
      this.checkHandler.abort();
      window.clearTimeout(this.timeoutId);
      this.checkHandler = null;
    }
    processMessage(message); // this is where the actual processing takes place

    // when we done with processing, we need to setup the heartbeat again:
    this.timeoutId = window.setTimeout(
      $.proxy(this.checkBeat, this), this.timeoutPeriod);
  }
};

在服务器端利用这个对象非常简单:您只需替换类似于 this example 中的行...

Ok.stream(events &> Comet(callback = "parent.cometMessage"))

...这样:

Ok.stream(events &> Comet(callback = "parent.CometProcessor.message"))