离线应用有不同的架构,我采用的架构需要在后台实时判断用户是否在线,也就是说,判断用户的网络是否通畅。 基本思路是:
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,则无法使用。
如果在线状态,数据会自动向服务端同步。