Как ограничить количество запросов на сервер при создании поисковика?

Question

[Nik Faraday]

Проект на asp.net core mvc. Есть поисковая строка. При изменении текста я поле ввода делается запрос на сервер, откуда вытягивается json с результатами поиска. Для поисковой строки использую плагин которые и нормально работает с этими json, что упрощает работу, но хотел уточнить, что это не рукописная система поиска.

Проблема в том, что при быстром вводе результат не успевает обработаться и некоторые результаты могут по несколько раз выводиться

Как решение хочу ограничить число запросов на эндпоинт в секунду. Видел, есть какой-то AspNetCoreRateLimiter, но немного не понял по документации для чего он вообще используется и стоит ли конкретно его использовать для решения проблемы

Возможно, есть и другие варианты решения проблемы, с радостью рассмотрю их

Comments

[Роман Грицук]

Проблема в том, что при быстром вводе результат не успевает обработаться и некоторые результаты могут по несколько раз выводиться

Со стороны фронта можно ограничить ввод таким образом https://learn.javascript.ru/task/debounce.

[Nik Faraday]

Роман Грицук, запрос делает под капотом плагина, как это можно совместить?

[Shavadrius]

Nik Faraday, если это нормальный плагин, то там наверняка можно переопределить метод OnKeyDown (или как там определяется когда запрос отправлять). Там перед отправкой блокируйте инпут на ввод. А при успехе/неуспехе разблокируйте.

А еще лучше сделать отложенный запрос данных: что-то типа "если с момента нажатия последней клавиши при активном инпуте прошло 0.5 секунд, то отправляем". Люди печатают быстро и частое залипание инпута - пойдет не на пользу.

Answer 1

[MVV]

Не то, чтобы ответ, но идея ответа. И если чо непонятно - могу в каментах поуточнять.
Со стороны тыла (на C#) можно ограничить число параллельных запросов в целом к сервису безо всяких там плагинов, а саморучно сделанным велосипедом: семафором (например, SemaphoreSlim, как самым модным в этом сезоне). Либо сделать его статическим, либо (чтобы веру в IoC свято блюсти и модульные тесты делать) - запихнув в Singleton-сервис с теми же свойствами/методами, что и у семафора используются, и получать этот сервис через конструктор (передавать через DI - в бою, напрямую - в тесте).
Для семафора(сервиса) устанавливаете максимальное число параллельно выполняемых запросов в качестве начального значения. При входе в обработчик захватываете семафор (Wait/WaitAsync, таймаут - по вкусу), при выходе (лучше - в блоке finally того try, который начинается после захвата семафора) - освобождаете (Release).
Таймаут выставляете в зависимости от поведения фронта: какие у него у самого таймауты на запрос (в том числе - на повторение) и как он реагирует на задержку ответа и на всякие разные коды статуса HTTP в ответе. В целом, стратегии тут две. Первая - пытаться захватывать семафор с коротким таймаутом и в случае неудачи - возвращать другой код статуса, кроме ОК, чтобы сказать фронту, что он не прав. Вторая - тормозить лишние запросы таймаутами. Кароче, без знания вашего фронтового плагина тут точно не скажешь, а я его знать не знаю и знать не хочу.

Answer 2

[Сергей Соловьев]

Лучше будет выставлять больший таймаут перед запросом. Т.е. если сейчас запрос делается спустя 0,5 сек после ввода, то сделай спустя 1 сек.

Либо, чтобы запрос выполнялся, когда ввода не было X секунд

Comments

[Nik Faraday]

Запрос делает под капотом плагина, но там можно поставить задержку между запросами, но даже значение в 2с не помогает

[Сергей Соловьев]

Nik Faraday, можно конечно и рейт лимитер, но для таких задач это слишком жирно.
может есть варианты с другими плагинами?

[Nik Faraday]

Сергей Соловьев, да, такой вариант есть, но обновления JS библиотек на проде немного напряжное. Проще обновить серверную библиотеку изменив немного логики. А то ещё кроме библиотеки ещё статические папки обновляй, смотри, какие файлы можно обновлять, какие нет... Ну, думаю понимаете

[Nik Faraday]

Сергей Соловьев, примерно вот так выглядит конфиг плагина:

datasetURL: "..." // Откуда берём информацию,
datasetMethod: "post",
datasetPostData: {},
datasetHeaders: {},
datasetFormatting: function (data) {
    if (data.success) {
        return data.result.map(function (item) {
            return item.toString();
        });
    } else {
        return [];
    }
},
darkMode: true,
minCharacters: 2,
itemsLimit: 10,
minDelay: 200, // Задержка между вызовами, но она не спасает
onSelect: (v) => {
    location.href = '...' // Куда переходим при выборе элемента
}

[Сергей Соловьев]

Nik Faraday, увеличить minCharecters еще может помочь. 2 - мне кажется мало

[Nik Faraday]

Сергей Соловьев, вообще да, было бы не плохо, но, к сожалению, это также не решит проблему ((

[Сергей Соловьев]

Nik Faraday, а где этот код вставляется? можно было бы навернуть свою обертку (декоратор), которая будет вызывать плагин при выполнении условия (в данном случае - по превышении таймаута)

[Nik Faraday]

Сергей Соловьев, инициализация плагина осуществляется в _Layout, т.к. строка поиска находится в хедерее

[Сергей Соловьев]

Nik Faraday, я имею ввиду написать перехватчики событий. я не джаваскриптист, но есть же события, bubbles и т.д.
возможно ахинею несу

[Nik Faraday]

Сергей Соловьев, честно, сам не знаю) Вообще, возможно есть, нужно будет посмотреть

[Сергей Соловьев]

Nik Faraday, после инициализации плагина найти нужный searchbar, получить нужный event handler, и обернуть его своей функцией.
первое что приходит в голову