Using YUI to workaround SSL warnings when fetching JSON-P over HTTP

Modern browsers don’t allow content to be fetched using HTTP on a page delivered over HTTPS.
You get errors like:

IE: SEC7111: HTTPS security is compromised by http://xxx
Safari/Chrome: The page at https://xxx ran insecure content from http://xxx
Firefox: Blocked loading mixed active content "http://xxx"

In some cases the source of the data you want to load over JSON-P isn’t available over HTTPS. YUI has a module that’s advertised for cross-domain loading (, but it can also be used to work around the SSL problem.

This example uses a customized YUI from with only the io-xdr module. The io.swf should be obtained from the main YUI download.

<!DOCTYPE html>
<script type="text/javascript" src="yui-io-xdr.min.js"></script>
<script type="text/javascript">
YUI().use("io-xdr", function(Y) {
  // Register for the Flash transport{ src: 'io.swf', id: 'flash' });
  // xdrReady is fired when the Flash object is ready, I couldn't find a callback for when it fails to load (eg, on mobile devices). Probably best to include some SWFObject-style Flash detection first.
  Y.on('io:xdrReady', function(){
    // When ready, the JSON-P endpoint is requested"", {
      xdr: { use: 'flash' },
      timeout: 1000,
      arguments: { },
      // There are other callbacks, but these are the most useful
      on: {
        // This is a JSON-P response, it should be evaluated.
        success: function(id, o, args) { eval(o.responseText); },
        failure: function(id, o, args) { console.log('failed to load content'); }
  }, Y);
  // This is the callback function name requested from the endpoint.
  function cb(d) {


    Leave a comment