Pass accepts header parameter to jQuery AJAX

Question

When I inspect the following code in Chrome Console it shows me a Request header Accept:undefined

jQuery.ajax({
        url: _this.attr('href'),
        accepts: "application/json; charset=utf-8",
        
    });
});

How do I set accept type as JSON. I don't want to set a custom header or use beforeSend

score 79 · Accepted Answer · edited Apr 07 '22 at 19:32

79

Try this ,

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

See this post for reference:

Cannot properly set the Accept HTTP header with jQuery

Fixed : Uncaught SyntaxError: missing } after property list

edited Apr 07 '22 at 19:32

RadheShyam Patel

3
2

answered Sep 10 '12 at 07:53

karthick

11,998
6
56
88

1

chcek the very first parameter http://api.jquery.com/jQuery.ajax/. I know i can pass headers but why doesn't it work with accepts – aWebDeveloper Sep 10 '12 at 08:00
+1 Great, fixed my other issue http://stackoverflow.com/questions/18586403/sending-html-data-through-ajax-using-spring-mvc. – ATOzTOA Sep 03 '13 at 07:28

score 36 · Answer 2 · answered Sep 10 '12 at 08:02

36

There two alternate ways to set accept header, which are as below:

1) setRequestHeader('Accept','application/json; charset=utf-8');

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

answered Sep 10 '12 at 08:02

gaurang171

9,032
4
28
30

5

The 'text' value for IE was killing me. – Peter May 21 '14 at 16:08

score 24 · Answer 3 · answered Feb 19 '15 at 13:26

24

In recent versions of jQuery, setting "dataType" to an appropriate value also sets the accepts header. For instance, dataType: "json" sets the accept header to Accept: application/json, text/javascript, */*; q=0.01.

answered Feb 19 '15 at 13:26

koppor

19,079
15
119
161

score 13 · Answer 4 · answered Sep 30 '15 at 17:28

The other answers do not answer the actual question, but rather provide workarounds which is a shame because it literally takes 10 seconds to figure out what the correct syntax for accepts parameter.

The accepts parameter takes an object which maps the dataType to the Accept header. In your case you don't need to even need to pass the accepts object, as setting the data type to json should be sufficient. However if you do want to configure a custom Accept header this is what you do:

accepts: {"*": "my custom mime type" },

How do I know? Open jquery's source code and search for "accepts". The very first find tells you all you need to know:

    accepts: {
        "*": allTypes,
        text: "text/plain",
        html: "text/html",
        xml: "application/xml, text/xml",
        json: "application/json, text/javascript"
    },

As you see the are default mappings to text, html, xml and json data types.

score 7 · Answer 5 · edited Aug 27 '13 at 14:29

7

Try this:

$.ajax({
        beforeSend: function (xhr){ 
        xhr.setRequestHeader("Content-Type","application/json");
        xhr.setRequestHeader("Accept","text/json");
    }, 
    type: "POST",
    //........
});

edited Aug 27 '13 at 14:29

Petr R.

1,247
2
22
30

answered Aug 27 '13 at 14:08

Srinivas

71
1
1

1

This is the only solution that I could get working, and I use jQuery 2.0+ – pusle Jun 15 '16 at 13:56

score 6 · Answer 6 · edited Apr 02 '21 at 19:24

6

Although some of them are correct, I've found quite confusing the previous responses. At the same time, the OP asked for a solution without setting a custom header or using beforeSend, so I've being looking for a clearer explanation. I hope my conclusions provide some light to others.

The code

jQuery.ajax({
    .... 
    accepts: "application/json; charset=utf-8",
    ....
});

doesn't work because accepts must be a PlainObject (not a String) according to the jQuery doc (https://api.jquery.com/jquery.ajax/). Specifically, jQuery expect zero or more key-value pairs relating each dataType with the accepted MIME type for them. So what I've finally using is:

jQuery.ajax({
    ....
    dataType: 'json',
    accepts: {
        json: 'application/json'
    },
    ....
});

edited Apr 02 '21 at 19:24

Syscall

19,327
10
37
52

answered Oct 23 '14 at 15:56

Googol

2,572
20
9

This doesn't work for me (jQuery 1.9.1). The Accept header gets set to `*.*` (in Chrome and Firefox at least). Using karthick's "headers" option does work tho. – chichilatte Jan 15 '15 at 15:39
1

Yeah, quite, it's a `PlainObject`, but there's not explanation of what the keys should be... – nicodemus13 May 29 '15 at 18:40

score 5 · Answer 7 · answered Jan 23 '14 at 16:48

You had already identified the accepts parameter as the one you wanted and keyur is right in showing you the correct way to set it, but if you set DataType to "json" then it will automatically set the default value of accepts to the value you want as per the jQuery reference. So all you need is:

jQuery.ajax({
    url: _this.attr('href'),
    dataType: "json"
});

score 3 · Answer 8 · answered Mar 13 '14 at 10:03

I use jQuery.getJSON( url [, data ] [, success( data, textStatus, jqXHR ) ] ) for example:

var url="my.php";
$.getJSON( url, myObj )
.done(function( json ) { ... }) /* got JSON from server */
.fail(function( jqxhr, textStatus, error ) {
    var err = textStatus + ", " + error;
    console.log( "Failed to obtain JSON data from server: " + err );
  }); /* failed to get JSON */

getJSON is shorthand for:

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});

Pass accepts header parameter to jQuery AJAX

8 Answers8

Linked