detect and suppress errors loading javascript file

Question

I want to source a javascript file from facebook http://connect.facebook.net/en_US/all.js

The organization I work for has a firewall that blocks access to Facebook, it just goes to an html page that says "Access Denied blah blah blah"

I want to be able to put a javascript src tag <script src="http://... "> </script> and detect and suppress the warnings when the browser tries to evaluate the html as javascript.

Anyone know how?

Answer 1

With the standard <script> tag, not possible. There's nothing really running at the time when the script's src is hit and content downloaded, so you can't wrap that in a try/catch block. There's some tips here on how to dynamically load scripts. Maybe the browsers will add some stuff to the DOM element created there which you can check for.

Answer 2

Why do you not do this in very simple way?:

if(!window.FB) { // or (typeof window.FB === "undefined")
    alert ("ERROR: http://connect.facebook.net/en_US/all.js is not loaded");
}
if(!window.jQuery) { // or (typeof window.jQuery === "undefined")
    alert ("ERROR: jQuery is not loaded");
}
// and so on

Answer 3

This is a workaround, not a direct answer, but you could simply set up a reverse proxy outside the firewall for Facebook and load the script from there. Instead of failing more gracefully, it would allow the script not to fail.

Answer 4

Please try the function below, it will only call the onload_function if the script has loaded. You can set a timeout to cancel the script.

function include_js(url, onload_function) { 
    var script = document.createElement("script");
    script.type = "text/javascript";

    if (script.readyState) { 
        script.onreadystatechange = function(){
            if (script.readyState == "loaded" || script.readyState == "complete"){
                script.onreadystatechange = null;
                onload_function();
            }
        };
    } else {  
        script.onload = function(){
            onload_function();
        };
    }
    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
}

Answer 5

Try this, and see if it works for you:

<script type="text/javascript" onerror="throw('An error occurred')" src="http://connect.facebook.net/en_US/all.js"&gt;&lt;/script&gt;

Alternatively, if you have access to a proxy script to grab external content I would use it via an xmlHttpRequest to grab the JS content. If it is successful, eval the content (yes, eval is evil, I know).

I would add that if you know the JS will fail, then why bother?

Answer 6

Looks like jQuery.getScript is what you need as was mentioned. Or you can manually execute:

$.ajax({
  url: url,
  dataType: 'script',
  success: function(){document.write('<script src="http://... "> </script>');}
});

And append your html on successful load with the <script></script> tag.

Answer 7

In Firefox and IE, you should be able to use window.onerror for this. You can take advantage of the fact that scripts run in the order they are listed in the HTML to wrap an error handler around just the facebook script:

<script>
// Remember old error handler, if there is one.
var oldOnError = window.onerror;
// Special error handler for facebook script
window.onerror = function(message, url, linenumber) {
  // Potentially alert the user to problem
  alert('Problem with facebook: ...');
  // Return true to suppress default error handling
  return true;
}
</script>

<!-- Load facebook script -->
<script src="http://connect.facebook.net/en_US/all.js"&gt;&lt;/script&gt;

<script>
// Remove error handler for facebook script
window.onerror = oldOnError;
</script>