本地存储 vs Web SQL

Question

我正在开发一个移动 Web 应用程序。我正在使用 JQuery mobile。

我有一个页面，其中包含一个带有jquery listview的列表视图，当用户单击列表视图上的每个项目时，将传递与该项目关联的所有数据到对话框页面。我使用本地存储在页面之间传递值。然而，我要做的是记录用户的操作并将它们显示为活动源。记录他们单击了哪个项目，花了多长时间打开对话框页面，并能够在新页面上显示所有这些信息。例如：

您单击了项目a

您在项目b上花费了15秒

等等。

那么，本地存储适用于此还是 WEB SQL？

我还注意到，WeB SQL 不再得到积极维护了？http://www.w3.org/TR/webdatabase/ 这是否意味着它将被弃用？

本地存储示例：

每个项目都是一个 JSON 对象，我需要传递整个对象才能在新页面中查看，所以我有：

function addPostToLocalStorage(YTfeeditems){
    $(".item").on('click', function () {
        
        var i = $('.item').index(this);
        console.log(i);
        
        var Viditem = YTfeeditems[i];
        console.log(Viditem);

        localStorage['youtubeclickedPost'] = JSON.stringify(Viditem);
        storedItem = localStorage['youtubeclickedPost'];
        retrievPostFromLocalStorage();
    }
});

function retrievPostFromLocalStorage(){
    var retrievedStringItem = localStorage.getItem(['youtubeclickedPost']);
    var convertedPost = JSON.parse(retrievedStringItem);
    showDetailedPost(convertedPost);
}

当用户点击视频时，我希望能够存储视频的ID，记录点击时间，记录ytfullviewpage打开的时间，并在该页面中记录“赞”图像是否被点击或者“踩”图像是否被点击，将这些详细信息添加到本地存储中，并在新页面中检索它们以显示它们。我无法理解如何使用本地存储来实现此目标。我已经贴出了我的JavaScript代码（链接），这可能会让你更好地理解。

- Dot

---

如果可用，本地存储是理想的选择。它易于使用，并且您不需要任何类型的查询语言，因此SQL（任何类型）都会过度臃肿。 - Reinstate Monica Cellio

@Archer 目前我使用本地存储来存储用户点击的项目，我想能够检索用户点击的所有项目，但每次用户点击新项目时都会覆盖键，所以我只能检索最后存储的项目。我应该为用户点击的每个项目提供不同的键吗？如果是这样，如何实现，因为我正在通过列表循环？:s - Dot

您可以存储一个包含所有物品信息的对象。只需检索该对象，编写新信息，并再次保存即可。如果您提供要在每次单击时存储的信息示例，我将为您提供一个示例并发布答案。 - Reinstate Monica Cellio

@Archer非常感谢！我已经在pastebin上添加了我的javascript代码，并编辑了我的问题，附上了链接。请查看并告诉我您的想法。 - Dot

我整理了你添加的代码，但是我不理解它。你在一个函数内添加了一个事件处理程序？？？这意味着在该函数被执行之前，你不会处理点击事件。 - Reinstate Monica Cellio

@Archer，我现在已经将函数的处理程序移除了，现在它可以正常工作了。 - Dot

Answer 1

WEB SQL已被弃用，但仍可在某些平台上使用http://caniuse.com/#feat=sql-storage。 对于您的解决方案，localstorage可能已足够。如果您需要更多存储空间，请使用http://pouchdb.com/，因为它具有不同浏览器存储的交叉适配器和一些不错的功能，例如同步。

- timmak

---

对于 PouchDB 我的评价是 +1。它是一个优雅的解决方案，很好地替代了 Web SQL。 - Seiyria

@timmak 谢谢，我会看一下poucheDB，但是如果本地存储是一个好的解决方案，我想要使用它，但是我不太确定如何实现，如果我要存储一些项目并在新页面中检索它们所有。 - Dot