cross-origin communication

unlocking the secrets


don't make cross-origin requests

Same Origin Policy

The S.O.P. provides...

  • Protection for server
  • Protection for clients


Netscape days
RFC 6454 - 1999?
6454 6454


All browsers:
  • javascript
  • *java
  • *flash

Browser Implementations

There's IE, and then there's everyone else...


What isn't restricted?

  • <script src="..."/>
  • <img/video src="..."/>
  • <a href="..."/>
  • form submission
  • iframe embedded pages

Restrictions & Workarounds

iframe access

Javascript cannot be used to access most iframe properties/content


HTML5 Web Messaging (window.postMessage)

Fine Uploader

  • Web Messaging (traditional endpoint)
  • 303 redirect (S3 endpoint)

Images and videos

Javascript access to properties, and the ability to export.


  1. crossorigin attribute & Access-Control-Allow-Origin header (CORS)
  2. Proxying

Ajax requests

*Browsers will simply not send any cross-origin request


CORS spec


Exploits <script src="..."> exemption
Supported in all browsers
GET only


Allows for cross-origin ajax requests:
  • servers must opt-in
  • full support in all modern browsers
  • IE9/8 have partial support
  • no support for IE7 & older

Modern browsers & "simple" CORS

  • XMLHttpRequest
  • methods: GET, POST, HEAD
  • headers: Accept, Accept-Language, Content-Language, Content-Type
  • Content-Type: text/plain, application/x-www-form-urlencoded, multipart/form-data
  • request includes an Origin header
  • response must include an Access-Control-Allow-Origin header
  • response optionally includes Access-Control-Expose-Headers

Old browsers & "simple" CORS

  • XDomainRequest
  • IE 8-9
  • methods: GET, POST, HEAD
  • cannot send ANY headers!
  • request includes an Origin header
  • response must include an Access-Control-Allow-Origin header
  • no access to response headers
  • no access to response status

Modern browsers & "non-simple" CORS

  • browser-preflighted XMLHttpRequest
  • methods: DELETE, PUT
  • or GET/POST w/ non-simple headers or Content-Type
  • browser "preflights" request (OPTIONS) w/ Origin, Access-Control-Request-Method, & Access-Control-Request-Headers headers
  • server must respond with Access-Control-Allow-Origin, Access-Control-Allow-Methods, & Access-Control-Allow-Headers headers
  • browser then sends the original request w/ Origin header
  • server must respond w/ Access-Control-Allow-Origin header
  • Old browsers & "non-simple" CORS

    Not supported, but workarounds available for some cases:
    • DELETE/PUT method -> POST w/ _method param


    cross-origin communication

    By Ray Nicholus

    cross-origin communication

    • 2,460