使用带有typeahead js和bloodhound js的HTTP POST

Question

默认情况下,bloodhound.js将通过HTTP GET进行查询,但这使您容易受到JSON劫持.由于我有敏感信息要加载到typeahead,因此HTTP GET使我容易受到攻击.曾经有一个选择帖子的选项(如下所示:typeahead.js remote beforesend post data issue),但这不适用于最新版本(v.0.11.1).

Answer 1

我花了很多心痛并试验得到这个.在最新版本(v.0.11.1)中有一个transport函数选项,您可以使用它来委托您想要的任何内容(websockets,或$.ajax带有帖子的普通旧版本).

var accountBloodhound = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,

    remote: {
        url: '/account/search#%QUERY',
        wildcard: '%QUERY',
        transport: function (opts, onSuccess, onError) {
            var url = opts.url.split("#")[0];
            var query = opts.url.split("#")[1];
            $.ajax({
                url: url,
                data: "search=" + query,
                type: "POST",
                success: onSuccess,
                error: onError,
            })
        }
    }
});

$('#remote .typeahead').typeahead(null, {
    name: 'best-pictures',
    display: 'value',
    source: accountBloodhound 
}).bind('typeahead:select', function (ev, suggestion) {
    console.log('Selection: ' + suggestion);
});