I have a basic HTML website (with some javascript) using a simple anchor tag to download a file like so:

<a href="../resources/mexml/MexmlSamples-1.0.zip">Mexml Samples 1.0</a>

In order to track the number of downloads, I have an onclick handler that passes an event to Google Analytics like so:

$('#mybutton').click(function(e){ga('send','event','Download','MexmlSample','MexmlSample-1.0');});

This works as expected when downloading the file using Chrome on OS X, and IE on Windows 7. The file downloads and I see the event in my GA account.

When I test it in Safari 8 on Yosemite, the file does download, but GA only rarely sees the event. And of course I get the dreaded Failed to load resource: Frame load interrupted in the Safari error console.

I assume that I get the GA event sometimes because of a race condition between when Safari interrupts the action and when the GA code fires.

So can anything be done to fix this in Safari so that I always get the GA events?

Note that my question probably has the same root cause as this unanswered question: Frame load interrupted when downloading excel files

Update June 6

I am now thoroughly confused. I just noticed that if I open up a new browser page to my site (in Safari), and click on the download, then it gets logged by GA. However subsequent clicks download still the file, but don't get logged by GA.

If I close that window, and open a new one, then again the first download gets logged by GA.

In contrast, when using Chrome every download gets logged by GA.

I am now thinking that I may be looking at the wrong problem. The behavior I am seeing is telling me that Safari is maintaining a state in JavaScript that allows the first GA call to go through, but blocks all subsequent calls.

But this is the same code being run by Chrome, so I don't know where to how to even start debugging the problem.

I have a basic HTML website (with some javascript) using a simple anchor tag to download a file like so:

<a href="../resources/mexml/MexmlSamples-1.0.zip">Mexml Samples 1.0</a>

In order to track the number of downloads, I have an onclick handler that passes an event to Google Analytics like so:

$('#mybutton').click(function(e){ga('send','event','Download','MexmlSample','MexmlSample-1.0');});

This works as expected when downloading the file using Chrome on OS X, and IE on Windows 7. The file downloads and I see the event in my GA account.

When I test it in Safari 8 on Yosemite, the file does download, but GA only rarely sees the event. And of course I get the dreaded Failed to load resource: Frame load interrupted in the Safari error console.

I assume that I get the GA event sometimes because of a race condition between when Safari interrupts the action and when the GA code fires.

So can anything be done to fix this in Safari so that I always get the GA events?

Note that my question probably has the same root cause as this unanswered question: Frame load interrupted when downloading excel files

Update June 6

I am now thoroughly confused. I just noticed that if I open up a new browser page to my site (in Safari), and click on the download, then it gets logged by GA. However subsequent clicks download still the file, but don't get logged by GA.

If I close that window, and open a new one, then again the first download gets logged by GA.

In contrast, when using Chrome every download gets logged by GA.

I am now thinking that I may be looking at the wrong problem. The behavior I am seeing is telling me that Safari is maintaining a state in JavaScript that allows the first GA call to go through, but blocks all subsequent calls.

But this is the same code being run by Chrome, so I don't know where to how to even start debugging the problem.

• javascript
• safari
• osx-yosemite

Share Follow edited May 23, 2017 at 12:00 CommunityBot 111 silver badge asked May 26, 2015 at 12:47 Peter MPeter M 7,51333 gold badges5454 silver badges9595 bronze badges 2

• What http header to you set on the .zip file? Do you set Content-Disposition: attachment? Also does jQuery set the event listener as a capture listener? – dotnetCarpenter Commented Jan 5, 2020 at 17:31
• (if still unsolved...) I think you might be seeing a page navigation before the click propagates to mybutton. Is that the id for the div wrapping <a> element ? – trk Commented Apr 21, 2020 at 6:09

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 1

If you always want to get the ga event then the hitCallback is likely the only way to go until whatever is wrong with Safari is fixed. I use a similar pattern to send a GA event from a page in an app which is just a redirect after a whole load of database stuff has been executed in rails. There is no noticeable lag from adding the javascript redirect into the callback. However I am not sure how to initiate the download from javascript off the top of my head.

ga('send','event','Download','MexmlSample','MexmlSample-1.0', {
   hitCallback: function(){
   initiateDownload();
   })

I am not aware of any need to use the setTimeout() for pattern in this instance.

The only solution I can think of - is waiting till GA request will finish, and only after that set location.href to desired file download link. But this is not really good from user's perspective. (This can be achieved with hit callback https://developers.google./analytics/devguides/collection/analyticsjs/field-reference#hitCallback).

Probably HTML5 download attribute for href will solve the problem. I have no OSX with safari to test, so this is only my thoughts.