Check if user is blocking 3rd party domain

Question

I have run into an issue where a lot of our support calls are about our images not loading because the user is blocking amazon s3 or a similar 3rd party service. I use 3rd party services for hosting images, video, and some javascript. Is there a way to detect through javascript if a client is blocking a domain so that we display a message instead of having the user contact support?

$.ajax 'http://aws.amazon.com/s3/',
  type: 'GET',
  dataType: 'html'
  complete: (e, xhr, settings) ->
    if e.status == 200
      console.log "Not Blocking S3"
    else
      console.log "Blocking S3"

Based on the comments I made an attempt at it, but it is still not working. It returns blocking when I have no blocks.

The above example coffeescript code does not work as I believe a security error occurs because it is doing an ajax on a different domain. Firebug shows the request in red, but says 200. e.status is returning 0.

Answer 1

Load an image from the domain you want to check against.

<img id="checkImg" src="https://www.google.com/images/srpr/logo3w.pngAAA" />

​ Just a regular image tag (notice the AAA at the end to make it not work). Then you can check the width of the image to see if it loaded or not.

if(document.getElementById('checkImg').clientWidth != 275)
    alert("Error")

The Google logo is 275px wide but the error image (in Chrome at least) is only 18px. So if the image is not 275px wide, I know it did not load.

Demo