json到itemhash被切断 [英] json to itemhash gets cut off

问题描述

每次我在Wordpress中保存，更新或删除艺术家(自定义帖子类型)时，我都会使用本文中的代码来生成artist.json和events.json文件.我的问题可能与WP不相关，这就是为什么我将其发布在这里.

I'm using the code from this post to generate an artists.json and an events.json file every time I save, update or delete an artist (custom post type) in Wordpress. My question is probably not WP related, that's why I'm posting it here.

JSON文件用作Twitter的typeahead.js的输入.这种预先输入会产生怪异的行为(请参见这篇文章)，现在看来这有问题json文件在本地存储中的存储方式.

The JSON file is used as input for Twitter's typeahead.js. This typeahead gives weird behaviour (see this post), and now it seems that there's something wrong with the way the json file is stored in the local storage.

问题似乎出在将json文件转换为本地存储itemhash的时候(我对这些东西确实没有经验). json文件的格式为["artist1", "artist2", "artist3", "..."]，如果我使用Chrome开发者工具中的资源"标签，则可以看到json文件已转换并存储在本地存储中，但是如果我将__Artists__itemHash内容粘贴到txt文件中我可以看到文件最后被切断了.我以为这会导致预输入问题?

The problem seems to lie at the point where the json file is converted to the local storage itemhash (I'm really not experienced in this stuff). The json file is formatted as ["artist1", "artist2", "artist3", "..."] and if I use the Resources tab in the Chrome Developer Tools I can see that the json file gets converted and stored in the local storage, but if I paste the __Artists__itemHash contents in a txt file I can see that at the end the file gets cut off. I assume that this causes the problem with typeahead?

itemHash中的内容

The contents from itemHash

{
"0":
  {
    "value":"test10",
    "tokens": ["test10"],
    "datum": {"value":"test10"}
  },
"1":
  {
    "value":"test8",
    "tokens":["test8"],
    "datum":{"value":"test8"}
  },
"2":
  {
    "value":"test7",
    "tokens":["test7"],
    "datum":{"value":"test7"}
},

等...最后文件看起来像这样:

etc... At the end the file looks something like this:

"278":
{
 "value":"Luna // The file ends here...

json文件中总共有大约8000位艺术家，并且该文件是正确生成的(例如:所有艺术家都在其中).因此，也许与本地存储中的最大文件大小有关?这是我唯一能做的猜测，希望有人知道这种本地存储方式是如何工作的以及为什么文件会被切断.

There are around 8000 artists in the json file in total and this file is generated correctly (as in: all the artists are there). So maybe it has something to do with the max file size in local storage? That's the only guess I can make, hope someone knows how this local storage stuff works and why the file gets cut off.

作为参考，javascript(为调试添加了ttl):

For reference, the javascript (added the ttl for debugging):

$(document).ready(function() {
    $('input.search-event').typeahead({
        name: 'Events',
        prefetch: '/media/json/events.json',
        ttl: 0,
        limit: 10
    });

    $('input.search-artist').typeahead({
        name: 'Artists',
        prefetch: '/media/json/artists.json',
        ttl: 0,
        limit: 10
    });
});

更新

这种东西每分钟都变得越来越奇怪:

This stuff is getting weirder every minute:

在Chrome开发者工具的网络标签中，我看不到artist.json和events.json.与FF中的FireBug相同.

In the network tab of Chrome's Developer Tools I don't see artists.json and events.json. Same for FireBug in FF.

在Safari的Web检查器中，我确实看到了两个文件. artist.json的文件内容似乎已损坏(文件中间某处有很多空格，然后继续输入更多条目).但是，当我将内容粘贴到编辑器中时，所有条目似乎都在那里.

In Safari's Web Inspector I do see both files. The file contents of artists.json seems to be broken (at lot of whitespace somewhere in the middle of the file and it then continues with more entries). But when I paste the contents in an editor all the entries seem to be there.

events.json的内容似乎很好.

The contents of events.json seem to be fine.

如果我将一个条目添加到events.json，则在重置Safari时，该新条目将显示在Safari的typeahead字段中，但它不会显示在FF和Chrome中，因此可能表明存在缓存/本地存储错误.

If I add an entry to events.json this new entry shows in the typeahead field in Safari when I reset Safari, but it doesn't show in FF and Chrome so that probably indicates a caching / localstorage error.

Artists.json在所有三种浏览器中均不起作用.它会自动建议一些条目，但不会自动建议最后添加的条目(即使在重置Safari之后也不建议).我真的为这个疯了……

Artists.json is not working in all three browsers. It does autosuggest some entries, but not the last added ones (not even after resetting Safari). I'm really going crazy on this one...

更新2

当我在Chrome的控制台中键入window.localStorage.clear();时，本地存储将被删除.当我现在重新加载页面时，artist.json和events.json确实显示在网络"标签中.进步！然后，当我向两个文件中添加项目时，这些项目不会显示在typeahead字段中，但是如果我再次清除本地存储，则会显示添加的项目.

When I type window.localStorage.clear(); in Chrome's console the local storage gets deleted. When I now reload the page, artists.json and events.json do show up in the network tab. Progress! When I then add items to both files these items don't show up in the typeahead field, but the added items do show up if I again clear the local storage.

推荐答案

我最终删除了name和ttl属性，以防止该typeahead将json保存在本地存储中.无论如何，这会更好，因为json文件每周更新一次，即使不是每天更新一次.

I ended up removing the name and ttl properties to prevent that typeahead saves the json in the local storage. It's better anyway, since the json files get updated weekly if not daily.

但是我确实认为，由于文件被切断，Twitter的预输入保存到本地存储仍然存在问题.我将在 typeahead.js的github 中进行报告.

But I do think that there's still a problem with Twitter's typeahead saving to localstorage since the file got cut off. I'll report this on typeahead.js's github.

新JS

$(document).ready(function() {
    $('input.search-event').typeahead({
        prefetch: '/media/json/events.json',
        limit: 10
    });

    $('input.search-artist').typeahead({
        prefetch: '/media/json/artists.json',
        limit: 10
    });
});

这篇关于json到itemhash被切断的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！