Mysql 与HTML5中的Web应用程序进行离线和在线同步?

Mysql 与HTML5中的Web应用程序进行离线和在线同步?,mysql,html,sqlite,transactions,synchronization,Mysql,Html,Sqlite,Transactions,Synchronization,下面我有一个基本的web应用程序,其中实现了sqlite存储度量 我希望它能够随时更新我的mysql服务器,并存储值,以便在数据库失去连接后推送到数据库。我希望它能够 使用时间戳比较作为安全措施,以防服务器上的值不同,我们可以进行一次戳检查,以查看它试图更改的是否是最新的值。 这将从多台计算机上运行,因此需要某种故障保护 我相信这个事务只需要一种方式,值只需要更新服务器,不需要将值传递回应用程序,因此我们可以在真正完成后从技术上销毁数据库,或者在数据库在某个地方中断时执行回滚。这是一件可行的事情

下面我有一个基本的web应用程序,其中实现了sqlite存储度量

我希望它能够随时更新我的mysql服务器,并存储值,以便在数据库失去连接后推送到数据库。我希望它能够 使用时间戳比较作为安全措施,以防服务器上的值不同,我们可以进行一次戳检查,以查看它试图更改的是否是最新的值。 这将从多台计算机上运行,因此需要某种故障保护

我相信这个事务只需要一种方式,值只需要更新服务器,不需要将值传递回应用程序,因此我们可以在真正完成后从技术上销毁数据库,或者在数据库在某个地方中断时执行回滚。这是一件可行的事情,还是我真的要求很多

这里有一个非常基本的应用程序,我想作为一个模型使用

<!DOCTYPE html> 
<html>  
  <head>
    <title>Golf score keeper</title>
    <script src="http://www.google.com/jsapi"></script>
    <script>
      google.load("jquery", "1.4.1");
    </script>
    <script>
      var db = window.openDatabase("scores", "", "Previous Scores", 1024*1000);

      function insertScore(hole_num, num_strokes, course_id, email) {
       db.transaction(function(tx) {
      tx.executeSql('INSERT INTO Strokes (course_id, hole_num, num_strokes, email) VALUES (?, ?, ?, ?)', [course_id, hole_num, num_strokes, email]);
       });
      }

      function renderResults(tx, rs) {
    e = $('#previous_scores');
    e.html("");
    for(var i=0; i < rs.rows.length; i++) {
      r = rs.rows.item(i);
      e.html(e.html() + 'id: ' + r['id'] + ', hole_num: ' + r['hole_num'] + ', num_strokes: ' + r['num_strokes'] + ', email: ' + r['email'] + '<br />');
    }
      }

      function renderScores(email) {
    db.transaction(function(tx) {
      if (!(email === undefined)) {
        tx.executeSql('SELECT * FROM Strokes WHERE email = ?', [email], renderResults);
      } else {
        tx.executeSql('SELECT * FROM Strokes', [], renderResults);
      }
    });
      }

      $(document).ready(function() {
    db.transaction(function(tx) {
      tx.executeSql('CREATE TABLE IF NOT EXISTS Courses(id INTEGER PRIMARY KEY, name TEXT, latitude FLOAT, longitude FLOAT)', []);
      tx.executeSql('CREATE TABLE IF NOT EXISTS Strokes(id INTEGER PRIMARY KEY, course_id INTEGER, hole_num INTEGER, num_strokes INTEGER, email TEXT)', []);
    });

    $('#score_form').submit(function() {
     strokes = { 1: $('#hole1').val(), 2: $('#hole2').val() };
      for (var hole_num in strokes) {
        insertScore(hole_num, strokes[hole_num], 1, $('#email').val());
      }

      renderScores();
      return false;
    });

    $('#filter_previous_scores_form').submit(function() {
      e = $('#filter_by_email').val();
      renderScores(e);
      return false;
    });

    renderScores();
      });
    </script>
  </head>
  <body>
    <form method="get" id="score_form">
      <div>
    <label for="1">Hole 1</label>
    <input type="number" min="1" value="4" id="hole1" name="hole1" size="2" step="1" />
      </div>
      <div>
    <label for="2">Hole 2</label>
    <input type="number" min="1" value="4" id="hole1" name="hole2" size="2" step="1" />
      </div>
      <div>
    <input type="email" id="email" placeholder="Enter your email address" size="40"/>
      </div>
      <div>
    <input type="submit" value="Upload Score" />
      </div>
    </form>
    <div>
      <h2>Previous Scores</h2>
      <form id="filter_previous_scores_form">
    <input type="email" placeholder="Filter scores by email" size="40" id="filter_by_email" /><br />
    <input type="submit" value="Filter" />
      </form>
    </div>
    <div id="previous_scores">

    </div>
  </body>
</html> 

您应该在setInterval循环中进行查看。

您可以在找到navigator时应用setInterval的逻辑。online=true然后您可以调用ajax