Failed to load resource: net :: ERR_CONNECTION_REFUSED only for selective images from APIs
I am currently making a request GET
to the instagram API to get a bunch of photos with a specific tag, and returning the JSON object I get in Rails, calling back in JS and setting the HTML with an img link and thumbnail, etc. in the DOM.
What's strange is that after restarting my server, I get this error:
Failed to load resource: net::ERR_CONNECTION_REFUSED
only for some, but not all of the photos that are returned by the API.
var formdata = {tag: "myflsadventure"};
$.ajax({
url: "application/get_instagram_photos",
type: "POST",
datatype: 'json',
data: formdata,
success: function(response){
htmlz = "<div class='container'><div class='row'>";
count = 0;
rounded_style = " style='border:1px solid #; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;'"
$.each(response.data, function(i, item) {
if (count == 0 ){
htmlz += "<div class='col-md-6'><img src='"+item.images.standard_resolution.url+ "'" + rounded_style+"></div><div class='col-md-6'><div class='no-top'>";
count = count + 1;
}
else if (count == 9){
htmlz += "</div><div class='row'><div class='col-md-6'><div class='no-top'><div class='row'><div class='col-md-6'><img src='" + item.images.low_resolution.url+ "'" + rounded_style + "></div>";
count = count + 1;
}
else if (count == 13){
htmlz += "<div class='col-md-6'><img src='" + item.images.standard_resolution.url+ "'" + rounded_style + "></div></div></div>";
count = count + 1;
}
else if (count ==5){
htmlz += "</div><div class='row'><div class='col-md-3'><img src='" +item.images.low_resolution.url+ "'" +rounded_style+ "></div>";
count = count + 1;
}
else if ((count == 4) || (count == 12)){
htmlz += "<div class='col-md-6'><img src='"+item.images.low_resolution.url+ "'" + rounded_style +"></div></div></div></div></div>";
count = count + 1;
}
else if ((count == 6) || (count == 7) || (count == 8) ){
htmlz += "<div class='col-md-3'><img src='"+ item.images.low_resolution.url+ "'" + rounded_style + "></div>";
count = count + 1;
}
else if ((count == 3) || (count == 11)){
htmlz += "<div class='top'><div class='row'><div class='col-md-6'><img src='" + item.images.low_resolution.url + "'" + rounded_style + " ></div>";
count = count + 1;
}
else if ( count == 1){
htmlz += "<div class='row'><div class='col-md-6'><img src='" + item.images.low_resolution.url + "'" + rounded_style + " ></div>";
count = count + 1;
}
else{
htmlz += "<div class='col-md-6'><img src='"+ item.images.low_resolution.url+ "'"+ rounded_style + "></div></div>";
count = count + 1;
}
});
$("#myflsadventure").append(htmlz);
reapportion_les_fotos();
}
});
Here are my routes and finally my controller that makes the API call
post '/application/get_instagram_photos', to: 'school_applications#get_instagram_photos'
Controller method
def get_instagram_photos
respond_to do |format|
uri = URI("https://api.instagram.com/v1/tags/#{params[:tag]}/media/recent?client_id=myIDc&count=14")
response = Net::HTTP.get(uri)
format.json {render :json => response}
end
end
UPDATE:
This only happens on my development machine. After clicking on Heroku and browsing from other computers, the photos are loaded fine except else on my main work machine. It seems browser independent (tried Opera, Firefox, Safari and Chrome) and adblock independent (tried it in Chrome incognito as suggested in a similar SO post).
source to share
I had similar behavior on my development machine, where I got an error after editing mine .htaccess
to redirect. I could no longer access a specific website from any browser on any device on the same network (although I was able to access it from some shell commands). I strongly believe that my router had security issues and was blocking further access from browsers to the website. After about 24 hours, I was able to access the website again.
Now it has been a while since this question was asked, so I will not ask you to create the same environment to check if you also had a threshold of 24 hours and to further clarify the issue.
EDIT: Here is a link to the question where I was trying to fix the ERR_CONNECTION_REFUSED issue exclusively in browsers
source to share