AngularJS Resource prevent duplicate requests

Question

Having pagination on the page I've came across the issue, if the user clicks 3 times on the next page button it will send 3 requests to server. What would be the best solution to prevent it?

I'm using angularJs 1.6.6 with ngResource

Disable pagination while the request is not complete? – bluehipy Oct 19 '17 at 13:03 — bluehipy, Oct 19 '17 at 13:03

score 2 · Answer 1 · answered Oct 19 '17 at 16:58

2

disable the button click till the next page is loaded, or denounce the click event.

answered Oct 19 '17 at 16:58

Guy Yogev

861
5
14

score 1 · Accepted Answer · answered Oct 19 '17 at 22:49

The best solution is to debounce the button click function. When you debounce a function it will ignore subsequent calls to the function for X seconds.

Lodash comes with a throttle and debounce method for this purpose.

If you dont have lodash available then just go with disabling the button when it is clicked using ng-disabled

Whilst this sorts things client side, it doesn't prevent someone writing some malicious code to hammer you API so some server side protection is a good idea if you have time.

AngularJS Resource prevent duplicate requests

2 Answers2