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

barryred picture barryred · Feb 23, 2010 · Viewed 86.8k times · Source

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;
  }
});

Answer

terrycojones picture terrycojones · Dec 16, 2011

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!