Caching 猎犬不会将远程抓取的数据缓存在本地存储中

Caching 猎犬不会将远程抓取的数据缓存在本地存储中,caching,local-storage,typeahead.js,bloodhound,Caching,Local Storage,Typeahead.js,Bloodhound,我正在尝试为typeahead加载人名的自动完成信息,如果已经有结果,则不必再次查询服务器 例如,如果我搜索一个人的姓名,并且从远程查询中检索到该人(以及其他人)的数据,那么当我删除姓名并搜索姓氏时,我希望显示以前缓存的带有该姓氏的姓名。实际发生的情况是,再次从服务器检索结果,并建议使用 缓存只在键入单个单词(“Mic”->“Mich”->“Micha”->“Michael”)时起作用 TL;DR:我想在本地存储中缓存来自《猎犬》的结果,不仅是来自预取(这无法应用于我的情况),还来自远程,并在再

我正在尝试为typeahead加载人名的自动完成信息,如果已经有结果,则不必再次查询服务器

例如,如果我搜索一个人的姓名,并且从远程查询中检索到该人(以及其他人)的数据,那么当我删除姓名并搜索姓氏时,我希望显示以前缓存的带有该姓氏的姓名。实际发生的情况是,再次从服务器检索结果,并建议使用

缓存只在键入单个单词(“Mic”->“Mich”->“Micha”->“Michael”)时起作用

TL;DR:我想在本地存储中缓存来自《猎犬》的结果,不仅是来自预取(这无法应用于我的情况),还来自远程,并在再次查询远程之前使用它

我现在拥有的是

function dispkey(suggestion_object){
  console.log(suggestion_object);
  return suggestion_object["lastname"] + ", " + suggestion_object["firstname"];
}

var engine = new Bloodhound({
  name: 'authors',
  local: [],
  remote: 'http://xxxxxx.xxx/xxxx/xxxxxxxxxx?query=%%QUERY',
  datumTokenizer: function(d) {
    return Bloodhound.tokenizers.whitespace(d.val);
  },
  queryTokenizer: function (s){
    return s.split(/[ ,]+/);
  },
});

engine.initialize();

$('.typeahead').typeahead({
    highlight: true,
    hint: true,
    minLength: 3,
},
{
  displayKey: dispkey,
  templates: {
     suggestion: Handlebars.compile([
      '<p id="author_autocomplete_email_field" >{{email}}</p>',
      '<p id="author_autocomplete_name_field">{{lastname}} {{firstname}}</p>',
      ].join(''))},
  source: engine.ttAdapter(),
});
当我使用它时,“lala”从未在chrome调试控制台中输出。

如前所述,此时不可能从
localstorage
获取远程建议

然而,我最近在一个小项目中工作,我需要存储以前的表单输入,以便将来在typeahead.js中使用。为此,我将表单输入值数组保存到
localstorage

var inputs = ['val1', 'val2', 'val3', 'val4'];
localStorage.setItem('values', JSON.stringify(inputs));
然后,我检索了数组以在typeahead字段中使用

var data = JSON.parse(localStorage.getItem('values'));
$('input').typeahead({
    minLength: 3,
    highlight: true,
},
{
    name: 'data',
    displayKey: 'value',
    source: this.substringMatcher(data)
});

您可以查看我的。

除非您想要fork typeahead.js,否则现在无法将远程建议保存到本地存储。如果这是您认为项目应该支持的,我建议打开一个特性请求。哦,
datumTokenizer
不用于远程建议,它仅在通过本地和预取从加载的数据库检索建议时使用。可以,谢谢您的建议。你可以用你的评论作为答案,因为这正是我想要的。这里有一个警告(我认为如果不正确,请更正),那就是它将在用户刷新页面时起作用。解决方案是在每次添加新缓存数据时重新初始化typeahead/bloodhound,但这听起来有点像黑客攻击,而且如果您不断向其添加新数据,也没有简单的方法来检查本地存储的年限。因此,您需要使用本地存储项的名称来设置一个巧妙的方案,以保持数据的新鲜。但是,唉,您的解决方案Brett相当不错,我认为任何需要此类功能的人都可以使用它。-我的完整解决方案将在页面刷新后工作,因为它使用
localstorage
。如果需要对自动建议的字符串进行加权或排序,可以使用日期键存储它们,并在匹配算法中使用。
var data = JSON.parse(localStorage.getItem('values'));
$('input').typeahead({
    minLength: 3,
    highlight: true,
},
{
    name: 'data',
    displayKey: 'value',
    source: this.substringMatcher(data)
});