I am unable to pull data using AJAX from the public Reddit API when using the private browsing mode of Firefox. The code works fine when not in private browsing mode.
By public API, I'm referring to endpoints like https://reddit.com/r/funny/.json Note that this link will work in both regular or private browsing mode if you try to go there directly. However, using that same link from AJAX does not work in private browsing mode as demonstrated in this code:
var url = "https://www.reddit.com/r/funny/.json?limit=4";
$.ajax({
type: 'GET',
url: url,
dataType: 'jsonp',
success: function(data) { $('#foo').append('<p>Success!</p>'); },
error: function() { $('#foo').append('<p>Failure!</p>'); },
jsonp: 'jsonp'
});
JSFiddle link (try in both regular and private browsing windows)
I thought maybe JSONP would help in this situation, but that does not appear to be the case, or I'm just doing it wrong. JSONP documentation seems very sparse, especially as it related to the Reddit API.
CodePudding user response:
The error shown by Firefox in the console when sending the request is:
The resource at “https://www.reddit.com/r/funny/.json?limit=4&jsonp=jQuery400175737938774993335244664702950021422623963_1631658838396&_=1631658838397” was blocked because content blocking is enabled.
In private mode or with Enhanced Tracking Protection enabled, Firefox 72 and up will block third-party requests to some domains, according to a list by disconnect.me, which can be found on GitHub.
reddit.com is one of those domains, being classified as "FingerprintingGeneral" as well as "Social". As per a footnote in the Mozilla blog:
A tracker on Disconnect’s blocklist is any domain in the Advertising, Analytics, Social, Content, or Disconnect category. A fingerprinter is any domain in the Fingerprinting category. Firefox blocks domains in the intersection of these two classifications, i.e., a domain that is both in one of the tracking categories and in the fingerprinting category.
(emphasis added, these are the classifications that apply here)
Your safest bet to display that content for it to also work in Firefox and other browsers with similar tracking protections would probably be to get the data from your own API backend instead of sending a request to Reddit directly from the frontend.
Or, if that is not an option, you can add good error handling and ask your users to disable Enhanced Tracking Protection for your site to see the content they're missing out on.