AJAX 调用成功后将 JSON 数据存储在 jQuery cookie 中

Question

我正在尝试将通过 AJAX 检索的 JSON 数据存储在 jQuery cookie 中。我正在使用以下插件：https://github.com/carhartl/jquery-cookie 来实现这一点。当我存储非 JSON 对象时，该插件效果很好。

我可以看到它在存储简单字符串时工作得很好。但是，当我尝试存储从 AJAX 调用中获得的 JSON 数据时，cookie 没有保存。这是我的相关代码：

        $.ajax({
            dataType: "json",
            url: "http://www.example.com/sandbox/BF/context/messagesNew.php",
            success: function(data) {
            
                //This works
                $.cookie('Name', 'John');
                console.log($.cookie('Name'));
              
                //This does not work
                $.cookie("test-data", JSON.stringify(data));
                var myJSONCookie = JSON.parse($.cookie("test-data"));
                console.log(myJSONCookie); // Returns error in console: SyntaxError: JSON Parse error: Unexpected identifier "undefined"
            }
        });

我已经尝试了其他几个代码片段，但 none 工作正常。我什至不认为 test-data 被创建为 cookie，因为当我将整个 $.cookie(); 记录到控制台时，我的名为 Name 的 cookie 出现了，但 test-data 没有出现。

Answer 1

您尝试放入 cookie 中的值对于 cookie 来说太大了。 Cookie 限制在 4k 左右。一部分是为了存储管理，一部分是因为对服务器的每个请求都会发送所有 cookie。如果您存储了一个 9MB 的 cookie，那么您将在每个页面或 ajax 向该服务器发出请求时额外发送 9MB，这显然是一场灾难。

LocalStorage 是另一个选项，它具有更大的存储限制，仍然按域分区，并且没有在每次请求时向服务器发送大量内容的问题。

如果 LocalStorage 也不够大，那么您可以开始只考虑包含类似 IndexedDB 的现代浏览器，您可以阅读 here。

您可能需要不同的设计方法。我们可能可以提供不同方法的想法，但必须了解您要解决的总体问题以及为什么您需要在本地存储 9MB 并且不能在将来需要时从服务器中检索它？

AJAX 调用成功后将 JSON 数据存储在 jQuery cookie 中

Storing JSON data in jQuery cookie after successful AJAX call

javascript

jquery

ajax

json

cookies