crossorigin.me is just a simple proxy site.

A CORS proxy is a service that allows developers (probably you) to access resources from other websites, without having to own that website.

The basic idea:

  • There are headers that come along with network requests. Be it the browser requesting an image with <img>, an Ajax request, the src of an <iframe>, whatever.
  • One of those headers is Access-Control-Allow-Origin
  • Browsers use that sometimes to determine what you can and can't do with that request data, largely for security reasons
  • If the Access-Control-Allow-Origin has the value that matches the domain you're using it on (or is a *) permission is granted to do whatever.

I'm sure it's more nuanced than that, but that's the idea.

Sometimes people have CORS issues on CodePen. Assets hosted right on CodePen (through our Asset Hosting PRO feature) are served with proper CORS headers, but even then sometimes there are weird browser bugs. We've seen people have luck passing files through CrossOrigin.me, so if you've experienced anything like this, might as well try it. The most common annoyance is people trying to draw images to <canvas>.

To use, just put the full URL to the resource after the last slash in http://crossorigin.me/, like:

http://crossorigin.me/https://cdn.css-tricks.com/wp-content/uploads/2015/07/flex-wrap.jpg