javascript - Ways to circumvent the same-origin policy -

the same origin policy

i wanted make community wiki regarding html/js same-origin policies searching topic. 1 of searched-for topics on , there no consolidated wiki here go :)

the same origin policy prevents document or script loaded 1 origin getting or setting properties of document origin. policy dates way netscape navigator 2.0.

what of favorite ways go around same-origin policies?

please keep examples verbose , preferably link sources.

the document.domain method

• method type: iframe.

note iframe method sets value of document.domain suffix of current domain. if so, shorter domain used subsequent origin checks. example, assume script in document @ http://store.company.com/dir/other.html executes following statement:

document.domain = "company.com"; 

after statement executes, page pass origin check http://company.com/dir/page.html. however, same reasoning, company.com not set document.domain othercompany.com.

with method, allowed exectue javascript iframe sourced on subdomain on page sourced on main domain. method not suited cross-domain resources browsers firefox not allow change document.domain alien domain.

source: https://developer.mozilla.org/en/same_origin_policy_for_javascript

the cross-origin resource sharing method

• method type: ajax.

cross-origin resource sharing (cors) w3c working draft defines how browser , server must communicate when accessing sources across origins. basic idea behind cors use custom http headers allow both browser , server know enough each other determine if request or response should succeed or fail.

for simple request, 1 uses either get or post no custom headers , body text/plain, request sent header called origin. origin header contains origin (protocol, domain name, , port) of requesting page server can determine whether or not should serve response. example origin header might this:

origin: http://www.stackoverflow.com 

if server decides request should allowed, sends access-control-allow-origin header echoing same origin sent or * if it’s public resource. example:

access-control-allow-origin: http://www.stackoverflow.com 

if header missing, or origins don’t match, browser disallows request. if well, browser processes request. note neither requests nor responses include cookie information.

the mozilla team suggests in their post cors should check existence of withcredentials property determine if browser supports cors via xhr. can couple existence of xdomainrequest object cover browsers:

function createcorsrequest(method, url){     var xhr = new xmlhttprequest();     if ("withcredentials" in xhr){         xhr.open(method, url, true);     } else if (typeof xdomainrequest != "undefined"){         xhr = new xdomainrequest();         xhr.open(method, url);     } else {         xhr = null;     }     return xhr; }  var request = createcorsrequest("get", "http://www.stackoverflow.com/"); if (request){     request.onload = function() {         // ...     };     request.onreadystatechange = handler;     request.send(); } 

note cors method work, need have access type of server header mechanic , can't access third-party resource.

source: http://www.nczonline.net/blog/2010/05/25/cross-domain-ajax-with-cross-origin-resource-sharing/

the window.postmessage method

• method type: iframe.

window.postmessage, when called, causes messageevent dispatched @ target window when pending script must executed completes (e.g. remaining event handlers if window.postmessage called event handler, previously-set pending timeouts, etc.). messageevent has type message, data property set string value of first argument provided window.postmessage, origin property corresponding origin of main document in window calling window.postmessage @ time window.postmessage called, , source property window window.postmessage called.

to use window.postmessage, event listener must attached:

    // internet explorer     window.attachevent('onmessage',receivemessage);      // opera/mozilla/webkit     window.addeventlistener("message", receivemessage, false); 

and receivemessage function must declared:

function receivemessage(event) {     // event.data; } 

the off-site iframe must send events via postmessage:

<script>window.parent.postmessage('foo','*')</script> 

any window may access method on other window, @ time, regardless of location of document in window, send message. consequently, event listener used receive messages must first check identity of sender of message, using origin , possibly source properties. cannot understated: failure check origin , possibly source properties enables cross-site scripting attacks.

source: https://developer.mozilla.org/en/dom/window.postmessage