客户端Android Phonegap App上的实时状态更新

Aus*_*tin 2 android tcp socket.io cordova

我正在尝试找到向我的用户发送在我的服务器上运行的进程的实时状态更新的最佳方法 - 此过程分为五个部分.现在我只是每隔几秒钟使用一次Ajax调用将状态"拉"到一个连接到MySQL并读取状态的PHP文件,但是你可以想象,这对我的数据库来说非常困难并且不能正常工作与没有强大的互联网连接的用户一起使用.

所以我正在寻找一种能够将数据"推送"到我的客户端的解决方案.我现在在我的服务器上运行APE推送引擎,但我猜测Socket.IO更适合这个?如果他们使用3G而他们错过了状态更新怎么办?

提前致谢 :)

小智 5

我猜我的答案可能与你的需要相符.

第一:你必须得到Node.js来运行socket.io

以下是服务器的示例代码:

var app = require('http').createServer(handler)
  , io = require('socket.io').listen(app)
  , fs = require('fs')

app.listen(8800);  //<---------Port Number

//If No Connection / Page Error
function handler (req, res) {
  fs.readFile(__dirname + '/index.html',
  function (err, data) {
    if (err) {
      res.writeHead(500);
      return res.end('Error loading index.html');
    }

    res.writeHead(200);
    res.end(data);
  });
}

//If there is connection
io.sockets.on('connection', function (socket) {

  //Set Varible
  var UserID;
  var Old_FieldContent = "";

  socket.on('userid', function (data) { 
    if(data.id){
      UserID = data.id;
      StartGetting_FileName(UserID)
    }
  });

  //Checking New Status
  function StartGetting_FileName(UserID){

    //Create Interval for continues checking from MYSQL database
    var myInterval = setInterval(function() {

      //clearInterval(myInterval);

      //MySQL Connection
      var mysql      = require('mysql');
      var connection = mysql.createConnection({
        host     : 'localhost',
        port     : '3306',
        user     : 'root',
        password : 'ABCD1234',
        database : 'test',
      });

      //Setup SQL Query
      var SQL_Query = "SELECT FileName FROM status WHERE UserID = '"+UserID+"'";

      connection.connect();

      connection.query(SQL_Query, function(err, rows, fields) {

        //Do if old result is, different with new result.
        if(Old_FieldContent !== rows[0].FileName){
          if (err) throw err;

          //Display at Server Console
          console.log('------------------------------------------');
          console.log('');
          console.log('Fields: ', fields[0].name);
          console.log('Result: ', rows[0].FileName);
          console.log('');
          console.log('------------------------------------------');

          //Send Data To Client
          socket.emit('news', { FieldName: fields[0].name }); 
          socket.emit('news', { FieldContent: rows[0].FileName });

          //Reset Old Data Variable
          Old_FieldContent = rows[0].FileName;
        }
      });

      connection.end();
    }, 500 );
  }
});
Run Code Online (Sandbox Code Playgroud)

以下是客户HTML和JS:

<!doctype html>
<html>
<head>
<title>web sockets</title>
<meta charset="utf-8">
<!-- URL PATH TO LOAD socket.io script -->
<script src="http://15.17.100.165:8800/socket.io/socket.io.js"></script>
<script>


//Set Variable
var UserID = "U00001"; 
var socket = io.connect('http://15.17.100.165:8800');
var Field_Name = "No Data";
var Field_Content = "No Data";


// Add a disconnect listener
socket.on('connecting',function() {
    msgArea.innerHTML ='Connecting to client...';
    console.log('Connecting to client...');

    //Once Connected Send UserID to server 
    //for checking data inside MYSQL
    socket.emit('userid', { id: UserID });
});


// Get data that push from server
socket.on('news', function (data) {
    console.log(data);
    writeMessage(data);
});


// Add a disconnect listener
socket.on('disconnect',function() {
    msgArea.innerHTML ='The client has disconnected!';
    console.log('The client has disconnected!');
});


//Function to display message on webpage
function writeMessage(msg) {
    var msgArea = document.getElementById("msgArea");
    if (typeof msg == "object") {
        //  msgArea.innerHTML = msg.hello;
        if(msg.FieldName !== undefined){
            Field_Name = msg.FieldName;
        }  
        if(msg.FieldContent !== undefined){
            Field_Content = msg.FieldContent;
        }  

    }else {
        msgArea.innerHTML = msg;
    }

    msgArea.innerHTML = Field_Name +" = "+ Field_Content;
}


</script>
</head>
<body>
<div id="msgArea">
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)