如何使用 Javascript 将 cookie 存储在本地存储中？

Question

我有一个基于 Javacript 并使用 Phonegap/Applaud 制作的适用于 Android 的应用程序（希望以后是 iPhone）。

很遗憾，设置和获取 cookie 不适用于 Android，这可能是 Android 环境所特有的。有人建议我使用“本地存储”可能更可靠。

但是，直到今天早上我才对本地存储一无所知，所以我很难熟悉。据我所知，它基本上只是另一个用不同语法保存数据的地方。就我的情况而言，除了 Android 强迫我使用它之外，我认为它没有给我任何优于 cookie 的优势。因此，我希望我仍然可以利用我现有的代码来设置和获取 cookie，而不必采用全新的方法。

当然，我可以在我的 Javascript 中做一个测试，看看是否有本地存储，如果有，就在那里存储和检索我的 cookie 数据，如果没有，那么就照常使用 cookie？

注 1： 我在 Stack Overflow 上搜索过类似的问题，有 this one which at first seems exactly what I'm talking about，但它太简洁了，所以我无法解析它以了解我的内容应该这样做。另外，我认为它假设存在我认为我没有的库和代码。我还查看了this question，但我认为它与我所追求的相反。

注意 2：这是我当前用于获取和设置 cookie 的代码（从网络上的某个地方获取。在 Android 问题之前，它是坚如磐石的可靠）：

function getCookie(c_name)
{
    var c_start = document.cookie.indexOf(c_name + "=");

    if (document.cookie.length > 0)
    {
        if (c_start !== -1)
        {
            return getCookieSubstring(c_start, c_name);
        }
    }
    return "";
}

function setCookie(c_name, value, expiredays)
{
        var exdate = new Date();
        exdate.setDate(exdate.getDate() + expiredays);
        document.cookie = c_name + "=" + escape(value) +
        ((expiredays === null) ? "" : ";expires=" + exdate.toUTCString());
        alert("this is document.cookie: " + document.cookie);
}

Answer 1

看看http://diveintohtml5.info/storage.html。历史可能一点也不有趣，但它至少提供了一个很好的链接列表，可以链接到further-reading section 中的其他教程。

那么，现在开始您的代码。首先要提到的是localStorage 没有过期 - 它是持久的（直到用户手动清理所有内容）。如果你想使用更短的存储空间，你也可以使用sessionStorage，它具有相同的界面，但只持续到浏览器关闭。

改写代码很简单：

function getCookie(c_name) {
    return localStorage.getItem(c_name);
}

function setCookie(c_name, value, expiredays) {
    return localStorage.setItem(c_name, value);
}

Answer 2

localStorage 的行为与普通对象完全相同。

localStorage.somekey = "My data"; // set
alert(localStorage.somekey); // get
delete localStorage.somekey; // unset

localStorage 和任何其他 Object 之间唯一真正的区别是它是持久的。任何来自同一来源的页面都可以访问对象中的值，并且即使关闭浏览器，它们也仍然存在。

在数据存储方面，它们在各个方面都优于 cookie，因为它们不会在每个请求中都被发送到服务器（尽管这并不是说 cookie 无用 - 两者都有其优点）。

真的很简单;)

Answer 3

我使用了其他答案中的信息，所以这不是一个不同的答案，但我只是认为查看我最终得到的完整代码会对其他人有所帮助。这几乎可以作为使用 cookie 的替代品（就像我一样）。它测试本地存储，如果存在则使用它，如果不存在则使用 cookie。

请注意，您可能希望在实施时删除警报。

function getCookie(c_name)
{
    if(typeof localStorage != "undefined")
    {
        return localStorage.getItem(c_name);
    }
    else
    {
        var c_start = document.cookie.indexOf(c_name + "=");
        if (document.cookie.length > 0)
        {
            if (c_start !== -1)
            {
                return getCookieSubstring(c_start, c_name);
            }
        }
        return "";
    }
}

function setCookie(c_name, value, expiredays)
{
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + expiredays);
    if(typeof localStorage != "undefined")
    {
        alert("This place has local storage!");
        localStorage.setItem(c_name, value);
    }
    else
    {
        alert("No local storage here");
        document.cookie = c_name + "=" + escape(value) +
        ((expiredays === null) ? "" : ";expires=" + exdate.toUTCString());
    }
}