JavaScript CORS – Understanding Origin Header

ajaxcorshttphttp-headersjavascript

When we need to invoke an Ajax request we do:

if(typeof XMLHttpRequest !== 'undefined') xhr = new XMLHttpRequest();
else
{
    var versions = ["Microsoft.XmlHttp",
            "MSXML2.XmlHttp",
            "MSXML2.XmlHttp.3.0",
            "MSXML2.XmlHttp.4.0",
            "MSXML2.XmlHttp.5.0"
    ];

I already know that using XMLHttpRequest-2, we can make a cross origin request and that the Origin header is added.

When is this header added?

  • Is it added when a browser (that supports CORS) is performing a request (cross domain or non-cross domain)?
  • Or is it added automatically when the browser "sees" that the request target origin is different from the current origin?

I mean: what does the bold line mean?

Cross-origin HTTP requests have an Origin header. This header
provides the server with the request’s origin. This header is
protected by the browser and cannot be changed from application code.
In essence, it is the network equivalent of the origin property found
on message events used in Cross Document Messaging. The origin header
differs from the older referer [sic] header in that the referer is a
complete URL including the path. Because the path may contain
sensitive information, the referer is sometimes not sent by browsers
attempting to protect user privacy. However, the browser will always
send the required Origin headers when necessary.

Best Answer

The Origin header

When this header is added ?

During the header's stage, before the document's body is sent (after open, before send).

Is it added when a browser (that support CORS) is doing a request ? ( cross domain or non-cross-domain?)

It is added when the origin doesn't match the page from which the XMLHttpRequest is created, but may also be sent in a same-origin request.

Or does it added automatically when the browser "sees" that the request target origin is different from the current origin...

Yes.

However, the browser will always send the required Origin headers when necessary.

This is part of the XMLHttpRequest spec; if you're making a cross-domain request, in the request headers an extra header is sent. This header is e.g. Origin: http://www.stackoverflow.com and is appended by a standards-following browser without user interaction.

You can read more on the specification in MozillaWiki's Security section, WHATWG and html5.org. It is implemented by (that I know of) FireFox and Google Chrome. I don't believe it is part of W3C yet. Further do not assume the origin header is true, as it can be set manually by modified borwsers or other software.

Related Question