Question

我正在创建一个离线的第一个博客平台，它利用了IndexedDB和服务工作者。这里的想法是，如果用户离线并尝试发送帖子 - 在后台发送它。这个项目是我的论文，我只看了一个星期左右的承诺 - 如果这是一个简单的错误就道歉！

从我在react / redux中的操作，我成功发送了同步事件。

以下是我的同步事件处理程序的代码

self.addEventListener('sync', function(event) {
  if (event.tag == 'send_post') {
    //const URL
    console.log('sync from SW - send post');
    //this should try again if promise is rejected
    event.waitUntil(
      openDatabase('Outbox').then( (db) => {
        return databaseGet('posts',db).then( (posts) => {
          return sendAllFromOutbox(posts)
        } )
      } )

    );
  }
});

下面是openDatabase - （IndexedDB）

    function openDatabase(name) {
      return new Promise(function(resolve, reject) {
        var version = 10;
        var request = indexedDB.open(name, version);
        var db;
        request.onupgradeneeded = function(e) {
          db = e.target.result;
          e.target.transaction.onerror = reject;
        };
        request.onsuccess = function(e) {
          db = e.target.result;
          console.log('OPENED DATABASE');
          resolve(db);
        };
        request.onerror = reject;
      });
    }

以下是databaseGet

function databaseGet(type,db) {
  return new Promise(function(resolve, reject) {
    var transaction = db.transaction([type], 'readonly');
    var store = transaction.objectStore(type);
    var request = store.getAll();
    request.onsuccess = function(e) {
      var result = e.target.result;
      resolve(result);
    };
    request.onerror = reject;
  });
}

最后，下面是sendAllFromOutbox

function sendAllFromOutbox(posts) {
  return fetch('https://stirapi.herokuapp.com/sendPost', {
    headers: {'Content-Type': 'application/json'},
    method: "POST",
    body: JSON.stringify(posts)
  })
  .then( (response) => {
    console.log('response from SW sendAllFromOutbox', response);
  } )
  .catch( (err) => {
    console.log('error from SW sendAllFromOutbox',err);
  } )
}

根据我的理解，如果sendAllFromOutbox失败/拒绝 - 它应该再次被调用。但它似乎没有被调用 - 因此不会在后台发送。

如果您想查看我的回购 - 它就在https://github.com/georgecook92/Stir。

谢谢！

乔治

Answer 1

由浏览器决定何时应重试失败的同步事件。此外，它不会无限重试，但您知道这是通过syncEvent.lastChance（spec）的最后一次尝试。

查看上面的代码，databaseGet需要(type,db)，但您将其称为databaseGet('posts')，这样当您尝试访问db的属性时会发生错误，这是未定义的。 Chrome的devtools应该会显示这一点，特别是“在捕获错误时突破”。

这里的想法是，如果用户离线并尝试发送帖子 - 在后台发送

无论用户的当前状态如何，最好使用后台同步。当然，navigator.onLine会告诉您用户是否确实离线，但如果onLine为真，则用户可能仍然没有可靠的连接。

Guide to background sync
Guide to promises
Promisified IDB - 相同的IDB API，但使用promises而不是事件

服务工作者后台同步 - 拒绝承诺 - waitUntil没有重试？

1 个答案: