离线时提示客户请求的策略

Question

上下文

向跟踪端点发出 PUT http 请求的移动客户端 Web 应用程序 (html/js)。应用建立在cordova之上，使用vuejs vuex、superagent和localforage

问题

当客户端离线时，请求以超时结束并且要传输的信息丢失。

我认为下一步是提示请求，我的问题是这个逻辑属于哪里。

解释同样的问题我被告知这应该在 service worker 上实现，但是阅读它我没有看到使用它有任何好处，因为客户端应用程序不依赖于使用诸如缓存响应之类的响应不会解决我的问题。

另一方面，我认为这可以通过在设备上存储请求提示并在成功发送到服务器后删除来实现。

问题

对于这个问题，有什么建议或好的做法可以遵循吗？
应该在服务工作者上还是在应用程序本身中实施？
是否有任何库可以解决同样的问题？

Answer 1

您的方法应该是将数据存储在本地内存中，即cache or IDB，然后在serviceWorker 中注册一个sync event。因此，当您的应用再次联机时，sync 事件将处理该任务。

这是一个例子：

在您要存储的应用程序内部：

  if ('serviceWorker' in navigator && 'SyncManager' in window) {
    navigator.serviceWorker.ready
      .then(function(sw) {
        var post = {
          data: 'Some Data'
        };
        writeData('sync-posts', post)     //save in local storage
          .then(function() {
            return sw.sync.register('sync-new-posts');
          })
          .then(function() {
            // display that post was saved for background sync (purely optional)
          })
          .catch(function(err) {
            console.log(err);
          });
      });
  } else {
    sendData();     //in-case browser is incompatible
  }

在 serviceWorker 中做这样的事情：

self.addEventListener('sync', function(event) {
  console.log('[Service Worker] Background syncing', event);
  if (event.tag === 'sync-new-posts') {
    console.log('[Service Worker] Syncing new Posts');
    event.waitUntil(
      readAllData('sync-posts')     //reading from local storage
        .then(function(data) {
          // upload the data & free up the storage
        })
    );
  }
});

管理工具 ServiceWorker：WorkBox

离线时提示客户请求的策略

Strategies to cue client requests when offline

javascript

offline

cordova

vue.js

service-worker

上下文

问题

问题