Cannot properly set the Accept HTTP header with jQuery

Question

I'm trying to set the Accept HTTP header to "text/xml" with this jquery code:

$.ajax({
    beforeSend: function(req) {
        req.setRequestHeader("Accept", "text/xml");
    },
    type: "GET",
    url: "[proper url]",
    contentType: "text/plain; charset=utf-8",
    dataType: ($.browser.msie) ? "text" : "xml",
    username: '---',
    password: '-------',                                
    success: function(data) {
        var xml;
        if (typeof data == "string") {
            alert("Data is string:" + data);
            xml = new ActiveXObject("Microsoft.XMLDOM");
            xml.async = false;
            xml.loadXML(data);
        } else {
            xml = data;
            alert("Data is not string:" + $(xml).text());
        }
        // Returned data available in object "xml"
        //alert("Status is: " + xml.statusText);
        $("#ingest_history").html($(xml).text());
    }              
});

In firefox it works great.

But in IE, the value that I am trying to set for the Accept header seems to get appended onto the end so it becomes: Accept: */*, text/xml. This causes my ajax call to return the html version as opposed to the xml version which I want.

Does anybody know how to properly set/clear the Accept header in IE 8?

Updated: For some reason the asterisks weren't appearing as I entered them. The Accept Header in IE appears to be: Accept: */*, text/xml.

Solution 1

I also had trouble with this, not just in IE but also in Chrome and Safari using jQuery 1.6.2. This solution appears to work as intended in all browsers I've tried (Chrome, Safari, IE, Firefox).

$.ajax({
    headers: { 
        Accept : "text/plain; charset=utf-8",
        "Content-Type": "text/plain; charset=utf-8"
    },
    data: "data",
    success : function(response) {
        ...
    }
})

Try that if this is still giving you trouble.

Solution 2

Using jQuery 1.5+ you can set the accepts headers per dataType so you can do something like this:

$.ajax({
    dataType: ($.browser.msie) ? "text" : "xml",
    accepts: {
        xml: "text/xml",
        text: "text/xml"
    }
});

Solution 3

Your problem seems to be the one described here: http://www.grauw.nl/blog/entry/470. The issue is that the XMLHttpRequest specification currently states that user agents should not set any Accept headers by default for the request, so that req.setRequestHeader() can just append new Accepts. Unfortunately browsers don't yet adhere to this. The problem writeup lets you test your browser to see if it works properly, and unfortunately IE7, Chrome, Safari, Firefox, and Opera all fail.

Laurens Grauw also talks about the effects of first trying to null out the Accept header with

setRequestHeader('Accept', '')

or

setRequestHeader('Accept', null)

These might help here.

Ugly server-side hacks: If you have control over your server-side app you can hardwire it to always return XML, add support for a custom media type like "application/i-really-want-xml", or add support for a custom HTTP header like "X-Accept".

Solution 4

I think the original poster might have been referring to this link: http://blogs.msdn.com/ieinternals/archive/2009/07/01/IE-and-the-Accept-Header.aspx however, this doesn't explain the behavior you see.

IE does not, by itself, have the behavior you describe, and setting the Accept header via XMLHTTPRequest should work properly. I've tested in IE8 to confirm.

It's possible there's an issue in your version of jQuery, or perhaps you have some plugin mangling your traffic?

Solution 5

Although this isnt how the documentation states it needs to be done, it is what worked for me.

 jQuery.ajax({
    type: "POST",
    url: "...",
    data: ...,
    contentType: "text/xml",
    beforeSend: function(req) {
    req.setRequestHeader("Accept", "text/xml");
    },  ...});

View more solutions

Comments

[Admin]

It doesn't add just the /. It actually adds: */* Formatting issue in the question

[BStruthers]

Yeah, I figured it was a formatting issue... I faced the same thing

[mplungjan]

setRequestHeader('Accept', null) gives "type mismatch" in IE8 Setting it to "" first works!

[nicodemus13]

From the source of 1.11.1- ' accepts: { "*": allTypes, text: "text/plain", html: "text/html", xml: "application/xml, text/xml", json: "application/json, text/javascript" },'

[nicodemus13]

So these are the accepts that are expected and as above you must set the dataType too.