Sencha touch Sencha Touch在iOS上的离线回退

我正在尝试使用2.2.1制作一个基本的Sencha Touch应用程序，它将在以下情况下离线工作。到目前为止，我所拥有的或多或少是一些不同字段的直接克隆，它在浏览器中工作得非常好

例如，在Chrome上，我可以看到存储在

localStorage

中的项目，如果我关闭计算机的互联网连接，这些项目就会被读取。但是在iOS上，我尝试将应用程序保存到主屏幕，并且在连接时效果很好。但是，一旦我将设备置于飞行模式，

localStorage

显示为空，我的列表显示为空

我已经尝试过使用JSON数据的本地副本，但它似乎没有通过

缓存.manifest

存储在iOS上，所以这也不是一个备用选项。有没有办法在iOS上的浏览器/主屏幕上工作？多谢各位

更新缓存的密钥控制器代码如下所示（注意，除了一些不同的型号/商店名称外，它与上面的示例相匹配）：

从上面的

控制台。log

调用中，我可以看到我的

localStorage

在浏览器上和连接时看起来很棒，但在iOS上断开连接后就空了（尽管在桌面上仍然可以脱机）

我的离线模式是：

Ext.define('MyApp.model.OfflineTable', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            "id",
            "text",
            "content",
            "group"
        ],
        identifier:'uuid', // needed to avoid console warnings!
        proxy: {
            type: 'localstorage',
            id: 'offlineTableData'
        }
    }
});

我的在线模式很简单

Ext.define('MyApp.model.Table', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            "id",
            "text",
            "content",
            "group"
        ]
    }
});

最后，我的商店是：

Ext.define('MyApp.store.Tables', {
    extend: 'Ext.data.Store',

    config: {
        model: 'MyApp.model.Table',
        proxy: {
            timeout: 3000,
            type: 'ajax',
            url: /* DATA URL */
        },
        autoLoad: true
    }
});

---

尝试从Ext.Application创建两个存储，而不是：

Ext.create（'Ext.data.Store'，{model:'MyApp.model.OfflineTable}）

使用相同的模型，并复制在线存储（TablesRemote）加载回调上的内容：

表远程：

Ext.define('MyApp.store.TablesRemote', {
    extend: 'Ext.data.Store',

    config: {
        model: 'MyApp.model.Table',
        proxy: {
            timeout: 3000,
            type: 'ajax',
            url: /* DATA URL */
        },
        autoLoad: true,

        listeners: {
            load: function(st, g, s, o, opts) {
                var localStore = Ext.getStore('TablesLocal');
                st.each(function(record) {
                    localStore.add(record);
                    localStore.sync();
                });
            }
        }
    }
});

本地：

Ext.define('MyApp.store.TablesLocal', {
    extend: 'Ext.data.Store',
    config: {
        model: 'MyApp.model.Table',
        proxy: {
            type: 'localstorage'
        },
        autoLoad: true
    }
});

然后您应该始终使用

MyApp.store.TablesLocal

访问数据

---

希望能有所帮助-

经过几个小时的调试，我终于找到了一个有效的解决方案。Sencha Touch处理

localStorage

的方式有一个完全（据我所知）未记录的细微差别。我遵循的原始示例的想法是，在线数据将同步到本地存储，以便以后以以下方式使用：

store.each(function(record) {
    var rec = {
        id: record.data.id,
        text: record.data.text,
        content: record.data.content,
        group: record.data.group
    };
    localStore.add(rec);
    localStore.sync();
});

然而，在实践中，这仅将数据本地存储在当前实例中，这与该点不符。Sencha实际上只更新浏览器的本地存储中的“脏”记录。由于我们正在创建全新的记录，它们会发出“干净”的声音。因此，为了让

localStore.sync（）

调用真正起作用，我们需要在上面的复制循环中弄脏记录，如下所示：

store.each(function(record) {
    var myRecord = Ext.create("MyApp.model.Table", {
        id: record.data.id,
        text: record.data.text,
        group: record.data.group,
        content: record.data.content
    });
    myRecord.setDirty();
    theStore.add(myRecord);
    theStore.sync();
});

本质上，我们正在基于全局表模型创建一个“脏”记录，并将其添加到本地存储，然后本地存储将正确地同步和存储它，因为它现在是“脏”的。这将每个记录存储为一个单独的

localStorage

属性，其中包含原始

脱机表数据

（如我们模型的代理ID中声明的）显然是作为所有条目的ID索引。因此，您将在

localStorage

中看到一大堆

offlineTableData

条目，但不会；我不确定是否有办法将其浓缩，但在初始同步后，它似乎可以在飞行模式的iOS设备上工作

---

希望这是有意义的，快乐编码。

所以我需要两家本地/在线商店？我在最初的问题中遵循的示例使用了两个模型和一个在线商店，然后在上面的控制器文件中创建了本地商店。是的，我知道。IMO的意见更好，是一种更具MVC的方式。我经常使用这种方法，从来没有遇到过任何问题，这是一个非常可控的解决方案。尝试过，但这只是一个简单的结构。我想我找到了我的问题：我对本地存储商店所做的更新实际上从未保存。Sencha仅在

sync

上同步“脏”记录。现在，我可以通过inspector查看存储在

localStorage

中的数据，但我必须找出如何将其读取回来。如果要了解Sencha如何同步的问题，请参阅我关于此问题的答案，以获得全部解决方案。

store.each(function(record) {
    var myRecord = Ext.create("MyApp.model.Table", {
        id: record.data.id,
        text: record.data.text,
        group: record.data.group,
        content: record.data.content
    });
    myRecord.setDirty();
    theStore.add(myRecord);
    theStore.sync();
});