How do I SET a Cookie (header) with XMLHttpRequest in JavaScript?

Question

I'm trying to set a Cookie in a XSS request using XMLHttpRequest.

I found the XMLHttpRequest Specification, and section 4.6.2-5 does seem to suggest that setting Cookie, Cookie2, and some other headers are not allowed, but I was hoping there was a work around.

My (jQuery) code is below, but the resulting query fails as the cookie is NOT set.

$.ajax( {
  type : "POST",
  url : URL,
  data: SOAP_INBOX_MAIL_QUERY,
  dataType : "xml",
  async: false,
  beforeSend : function(xhr) {  
    var cookie = credentials["COOKIE"];
    console.info( "adding cookie: "+ cookie );          
    xhr.setRequestHeader('Cookie', cookie);
  },
  success : function(data, textStatus, xmLHttpRequest){


  },
  error : function(xhr, ajaxOptions, thrownError) {
    credentials = null;
  }
});

Narda

fetch.spec.whatwg.org/#forbidden-header-name – Chamomile

Answer 1

This can be done. You need the following in the $.ajax call:

xhrFields: {
    withCredentials: true
}

(See the jQuery docs), and you'll also need the site you're making the request to to support CORS (they will at least need to allow you origin and also to set the Access-Control-Allow-Credentials HTTP header to true).

There's no question it works. You can do it over HTTPS, with Basic Auth, etc. jQuery will send everything (the auth header, cookies) if you tell it to (xhrFields) and the site provides the right CORS headers. Don't give up!

Acevedo

setting "withCredentials" added all cookies of my domain to the xhr request. Thanks for the hint! – Prosody

note server can't say "Access-Control-Allow-Origin: *". Chrome (and suspect other browsers too) would simply cancel the GET. – Gotham

Down voting as you have the correct answer to the wrong question, note that the OP seems to want to set a cookie in JavaScript on the request, presumably in the browser.Cf I'm trying to set a Cookie in a XSS request using XMLHttpRequest. – Bodgie

how would i do this in vanilla js? – Perspicuity

Answer 2

For security reasons, you will be unable to modify the header during an XMLHTTPRequest.

Microcurie

Unfortunately, from my reading, this does indeed seem to be the case. Thanks for confirming. – Narda

This should be the accepted answer as the OP is asking about setting a cookie on the request using JavaScript and not for the server to set a cookie on the response – Bodgie

Answer 3

If you set the cookie using document.cookie then when you send the request the cookie header will include it.

Twofaced

I did a set of tutorials on cookies with one of them being just about using javascript and cookies. Start at dbp-consulting.com/tutorials/web/cookieintro.html to learn about cookies in general and then it has links to a page about accessing them with javascript from the browser and via php from the server – Twofaced

FYI, it's interesting to note, that some platforms/environments don't seem to share document.cookie with XmlHttpRequests (XHR). As a result, it causes issue if you need to share cookies between the document & XHR, like for example, session state persistence via a session cookie. This was found to be seemingly so for Safari browser extensions and Mac OS X widgets. Works fine for Chrome extensions, Windows Vista/7 gadgets, etc. Don't know why Apple had to be so restrictive. And sadly no one had a solution or answer to my question of why that is so or how to workaround it. – Parity

To add to my previous comment, the (PHPSESSID) session cookie is set in document.cookie (and/or initial XHR request to fetch some data). Subsequent XHR to post back data should pass along that session cookie. In Chrome and Windows gadget, that worked fine automatically (no need to do manual cookie handling). It didn't work in Safari and Mac OS X widget. I tried manually set cookie request header with document.cookie and didn't work (though I didn't check if document.cookie had the needed cookie, which would be a separate issue with Apple). – Parity

Answer 4

https://developer.mozilla.org/En/Server-Side_Access_Control

allow you origin and also to set the Access-Control-Allow-Credentials HTTP header to true

Acadian

Answer 5

If your request at the same domain as jquery code, you can use jquery cookies plugin

Erigena