Last Updated: March 02, 2016
·
7.374K
· fr0gs

Wrap HTTP content into HTTPS in Ajax request from Codepen

When trying to access mixed content with ajax in codepen, say:

function call_api_chuck () {
    $.ajax({
      url: "http://api.icndb.com/jokes/random",
      jsonp: "callback",
      type: "GET",
      dataType: "jsonp",
      success: function (data) {
        $("#author").remove();
        $("#quote").append(data["value"]["joke"]);
      },
      xhrFields: {
    withCredentials: false
      }
    });
  };

And you have other resources in your pen accessed via HTTPS, you get a Mixed-Content error.
Simply add https://crossorigin.me/ before your url and it will be successfully wrapped.

url: "https://crossorigin.me/http://api.icndb.com/jokes/random"