I tried a few options:
- Using XMLHttpRequest to check for the existence of a file – this would be the cleanest way if the file was in the same domain as the HTML file, but XMLHttpRequest is usually blocked for cross domain calls. It worked on IE8 if the setting “Access data sources across domains” was enabled, but did not work in IE7 or Firefox
- Using an IFRAME on the page and communicate via URL fragments – this is a complicated trick that sites like Facebook use to address similar issues. The coding is complex, however, and can have impact on the Back button and things. (See http://msdn.microsoft.com/en-us/library/bb735305.aspx or http://wiki.developers.facebook.com/index.php/Cross_Domain_Communication)
- Using JSON calls to a service on the second server – browser security does allow calls to a web service on a different domain, but this would require putting code on that second server. This was not an option.
So I had to resort to a little less elegant approach, but one that requires minimal scripting and works across browsers. Nothing prevents us from pulling an image from another website, so we can place a 1×1 transparent gif on the other website as a “marker” for the file we are looking for. Then we simply put the img tag on our page and respond to the onload and onerror events.
<img src='http://otherwebsite.com/marker.gif' onload='DoIfItsThere();' onerror='DoIfItsNotThere();' style='visibility:hidden' />
While placing a marker file on other websites may not always be an option, this approach could be used to check whether that site is available. Want to see if Google is running? Just pull down the Google logo and if it works, it’s working! (Yes, bad example because Google has web services we could call. But you get the point)