Forums

Ajax GET Request Is Sent Twice

I have built a platform hosted on Pythonanywhere, written with the Flask web framework. In a Javascript file for a specific page, I have written an $.ajax request to a specific route in my app.py. This request works fine when I run my app on my personal machine, however, when I moved the app to Pythonanywhere, everytime the $.ajax request is fired, the request is duplicated, as evidenced by a duplicate database insertion and duplicate response in the javascript. I have tried using event.stopPropagation, checking that the div class is not bound to multiple handlers, etc, yet nothing works. I also posted about this issue over on Stackoverflow (post here), however, I think the problem may lie with the specific app on Pythonanywhere, since the request is only sent once on my machine. Does anyone know how this error might be resolved? Thank you very much!

A simplified example of my code:

In frontend.html:

<div class='wrapper'>
  <div class='submit_stamp' data-timestamp='2019-8-2'>Submit</div>
</div>

In frontend.js:

$('.wrapper').on('click', '.submit_stamp', function(){
 $.ajax({
   url: "/submit_time",
   type: "get",
   data: {time: $(this).data('timestamp')},
   success: function(response) {
     $('.wrapper').append(response.html);
   },
 });
});

In app.py:

@app.route('/submit_time')
def submit_time():
   db_manager.submit_stamp(flask.request.args.get('time'))
   return flask.jsonify({'html':'<p>Added timestamp</p>'})

if you check your access logs, do you see two ajax requests hitting the pythonanywhere server?

Yes, I do see the two requests hitting the server, one right after the other:

GET /add_availablilty_range?payload=%7B%22id%22%3A........
GET /add_availablilty_range?payload=%7B%22id%22%3A........

The access log is here:https://www.pythonanywhere.com/user/Ajax1234/files/var/log/www.katchup.work.access.log

Thank you for your help!

could a user have possibly double clicked on the button? perhaps you could do something like immediately disable to button on click so the user can't click again?

I do not think so, as I created a smaller example on another route on my app, and even though I click the element once, the access logs still display the request twice. Could this have to do with caching at all?

Actually I am wrong (somewhat). There is another ajax request on my site that works fine, and while the double GET appears in the log

GET /add_availablilty_range?payload=%7B%22id%22%3A........
GET /add_availablilty_range?payload=%7B%22id%22%3A........

the actual route is only called once. I added a print statement in the function bound to the route being called twice, and it turns out the somehow that function is being called twice by flask, while the GET listings still appear the same in the log. So I think the ajax is only being fired once, but the route is being called twice. How could this be?

Sorry, I added print calls to both routes for comparison, and it seems that each once is being called twice upon the firing of its respective $.ajax request:

for my first route:

2019-08-05 00:17:09 in add_contact
2019-08-05 00:17:13 in add_contact

for my second route:

2019-08-04 15:05:37 in add_timerange
2019-08-04 15:05:39 in add_timerange

How could this be? Thank you very much for your help!

If the access log shows two hits, that means the on the user browser end the ajax request is firing off twice. ie. the access log shows what is coming in before it even gets to your webapp.

Thank you for your response. What is strange, though, is that the first request of the duplicate pair is from one machine, while the second request of the duplicate is from another machine (one is running Firefox on Windows, the other, Chrome on Mac (my machine)):

128.177.108.218 - - [05/Aug/2019:16:35:03 +0000] "GET /submit_time?payload=.... HTTP/1.1" 200 76 "-" "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1" "128.177.108.218" response-time=0.217
108.49.84.40 - - [05/Aug/2019:16:35:05 +0000] "GET /submit_time?payload=....HTTP/1.1" 200 71 "http://www.katchup.work/create" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.142 Safari/537.36" "108.49.84.40" response-time=0.198

are you sure those are duplicate requests? maybe it's just someone accessing your website at around the same time? they are also coming from two different IPs?

Thank you for your help! Yes, those are coming from different IPs, yet the duplicate happens every time a send an ajax request on the site. It is baffling.

That certainly is very baffling! All of our infrastructure is Linux, so I can't think of any way any of it could be triggering a request that claimed to come from a Windows machine. Is it always coming from the same other IP address?

Hmm, that is indeed strange. With regards to the IPs, the "foreign" request IP is always 128.177.108.218. Could this a security issue on my end?

Seems like it is coming from the US, something like Georgia/Colorado. Is the payload submitted the same? Also are all requests mirrored, or just some? How about post requests?

Thank you for your help so far! Yes, every time, the payload is the same. Additionally, every request is indeed mirrored. However, I am not using any POST requests, so I am not really sure about that angle. Ultimately, I can simply write some code that attempts to check if a similar payload has already been submitted within a certain timeframe, but I am concerned that such a result would be hackish and inefficient. Can you suggest anything? Thank you very much!

are you doing the GETs with http or https? If it's https then people shouldn't be able to see your payload.

currently the GET is with http.

I'd recommend using HTTPS if you want the payload to be completely secure; if someone were somehow able to eavesdrop on the connection, with an HTTP connection they would be able to see the data that is being sent back and forth. That would require quite low-level network access, of course -- they'd need to somehow have access to the data being sent back and forth on one of the routers between you and our servers -- but it is at least technically possible.

By contrast, with an HTTPS request, they'd be able to tell that a request was being made to a particular hostname but nothing else.

GET vs POST are basically the same from a security perspective -- I think Conrad was just asking about that to try to narrow things down.

Thank you very much! The duplicate requests ceased when I ran the $.ajax from HTTPS! Thank you for your assistance, you guys are always so helpful!

Glad we could help! Still very perplexing, but I'm glad you got a solution in the end.

I was going through the same issue here.

Double access, double loading, double running of every script... I was like having two browsers doing the same thing. As it turns out, it was happening because I had a Chrome plugin called "Firebug Lite for Google Chrome" enabled.

As soon as I disabled it, the issue stoped .