天天看点

离线应用-实时判断系统是否离线

离线应用有不同的架构,我采用的架构需要在后台实时判断用户是否在线,也就是说,判断用户的网络是否通畅。 基本思路是:

1.  使用一个WorkerPool实时的向服务端发出请求

2.  把是否在线状态保存到浏览器数据库里供其他WorkerPool使用。

之下是代码:

1. 父WorkerPool, 负责在页面显示是否在线的图标:

/**

* The ParentWorkerPool of Monitor  whether the system is online or offline

*

* Alex([email][email protected][/email])

* 2009.3

*/

isOnlie: function(){

        workerPool = google.gears.factory.create('beta.workerpool');

        workerPool.onmessage = function(a, b, message) {

            if (message.sender == monitorchildWorkerId) {

                    if(message.text == 'online'){

                        $('#is-connected').show();

                        $('#is-disconnected').hide();

                    }else if(message.text == 'offline'){

                        $('#is-disconnected').show();

                        $('#is-connected').hide();

                    }

            }

        };

        var monitorchildWorkerId = workerPool.createWorkerFromUrl('/javascripts/js_app/models/monitor.js');

        workerPool.sendMessage(window.location + '?monitor', monitorchildWorkerId);

}

2. 子WorkerPool,负责实时发出请求并且保存状态到浏览器的数据库里(这里用gears的数据库):

* The ChinldWorkerPool of Monitor  whether the system is online or offline

var POLLING_INTERVAL = 2000;

var wp = google.gears.workerPool;

var url;

var parentId;

var first = true;

var online;

var request = google.gears.factory.create('beta.httprequest', '1.0');

var timer = google.gears.factory.create('beta.timer');

monitor = function (message) {

  var count = 0;

  var db = google.gears.factory.create('beta.database');

  db.open('red-CustomersManagement');

  request.open('HEAD', url + String(Math.floor(Math.random()*10000)));

  request.onreadystatechange = function() {

    if (request.readyState == 4) {

      try {

        if (request.status == 200) {

          rs = db.execute("select * from isonline",[]);

          if(rs.isValidRow()){count = rs.field(0)};

          if (!online) {

            online = true;

            if (count == 0){

                db.execute("insert into isonline (state) values (?)",['online']);

            }else{

                db.execute('update isonline set state=? where state=?;', ['online',"offline"]);

            rs.close();

            wp.sendMessage("online", parentId);

          }

        }

      }

      catch(e) {

        if (online || first) {

            online = false;

            first = false;

          db.execute('update isonline set state=? where state=?;', ['offline',"online"]);

          wp.sendMessage("offline", parentId);

      db.close();

      // wp.sendMessage('ddd', parentId);

      timer.setTimeout(monitor, POLLING_INTERVAL);

    }

  }

  try {

    request.send();

  catch(e) {

    if (online) {

      online = false;

    var db = google.gears.factory.create('beta.database');

    db.open('red-CustomersManagement');

    db.execute('update isonline set state=? where state=?;', ['offline',"online"]);

    db.close();

      wp.sendMessage("offline", parentId);

wp.onmessage = function(a, b, message) {

  url = message.text;

  parentId = message.sender;

  monitor(message)

效果图如下(图标是剽窃Google Reader的):

在线:

关闭服务器(离线) :

SyncDate链接只有在线状态可用,如果离线状态点击SyncData,则无法使用。

如果在线状态,数据会自动向服务端同步。

上一篇: 百度统计
下一篇: Design in 百度

继续阅读