Pass request headers in a jQuery AJAX GET call

Question

I am trying to pass request headers in an AJAX GET using jQuery. In the following block, "data" automatically passes the values in the querystring. Is there a way to pass that data in the request header instead ?

$.ajax({
         url: "http://localhost/PlatformPortal/Buyers/Account/SignIn",
         data: { signature: authHeader },
         type: "GET",
         success: function() { alert('Success!' + authHeader); }
      });

The following didn't work either

$.ajax({
         url: "http://localhost/PlatformPortal/Buyers/Account/SignIn",
         beforeSend: { signature: authHeader },
         async: false,                    
         type: "GET",
                    success: function() { alert('Success!' + authHeader); }
      });

Lukas · Accepted Answer · 2012-09-11 15:00:07Z

453

As of jQuery 1.5, there is a headers hash you can pass in as follows:

$.ajax({
    url: "/test",
    headers: {"X-Test-Header": "test-value"}
});

From http://api.jquery.com/jQuery.ajax:

headers (added 1.5): A map of additional header key/value pairs to send along with the request. This setting is set before the beforeSend function is called; therefore, any values in the headers setting can be overwritten from within the beforeSend function.

answered Sep 11, 2012 at 15:00

Lukas

9,8452 gold badges39 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Lukas Over a year ago

Yes: $.ajaxSetup({headers: {"X-Test-Header": "test-value"}})

Glen Selle Over a year ago

The jQuery docs don't recommend using $.ajaxSetup() anymore (api.jquery.com/jQuery.ajaxSetup)

MiniRagnarok Over a year ago

@Glen Their reasoning is that plugins might be expecting default settings to work. Personally, I think it's a given that if you globally change something, something that was depending on the default settings might not work.

Erik Philips Over a year ago

@Trip My recommendation for globally... write your own wrapper for ajax calls (abstraction) instead of calling $.ajax().

Lukas Over a year ago

@Rishav JSON objects are not allowed in headers. You'll have to JSON.stringify it and then parse it on the server.

|

Adam · Accepted Answer · 2013-01-18 20:52:58Z

325

Use beforeSend:

$.ajax({
         url: "http://localhost/PlatformPortal/Buyers/Account/SignIn",
         data: { signature: authHeader },
         type: "GET",
         beforeSend: function(xhr){xhr.setRequestHeader('X-Test-Header', 'test-value');},
         success: function() { alert('Success!' + authHeader); }
      });

http://api.jquery.com/jQuery.ajax/

http://www.w3.org/TR/XMLHttpRequest/#the-setrequestheader-method

edited Jan 18, 2013 at 20:52

answered Jul 15, 2010 at 18:31

Adam

45.1k17 gold badges107 silver badges145 bronze badges

8 Comments

matthew_360 Over a year ago

i know this is super-old by now. but I wanted to add that there should be a comma after: beforeSend: function(xhr){xhr.setRequestHeader('X-Test-Header', 'test-value');}

user1940268 Over a year ago

beforeSend: function(xhr){xhr.setRequestHeader('X-Test-Header', 'test-value');} works well in chrome and firefox but not in IE8. there is no X-Test-Header send. how to fix it? Thx

Ghanshyam Baravaliya Over a year ago

i have tried but it throw error when i am passing header detail in using "jquery-1.11.1.min.js"

thedanotto Over a year ago

see below answer, much more relevant

Si8 Over a year ago

What if I want to add X-Test-Header and X-Test-Header to the beforeSend?

|

enthusiast · Accepted Answer · 2016-07-05 07:19:21Z

58

$.ajax({
            url: URL,
            type: 'GET',
            dataType: 'json',
            headers: {
                'header1': 'value1',
                'header2': 'value2'
            },
            contentType: 'application/json; charset=utf-8',
            success: function (result) {
               // CallBack(result);
            },
            error: function (error) {
                
            }
        });

answered Jul 5, 2016 at 7:19

enthusiast

9997 silver badges11 bronze badges

3 Comments

Jeb50 Over a year ago

Using jQuery 1.7.2, C# API 2.x, when trying to extract from header HttpRequestMessage r = new HttpRequestMessage(); int mylogonID = Convert.ToInt32(r.Headers.GetValues("logonID")); error out because The given header was not found. because r.Headers is empty.

enthusiast Over a year ago

you may want to try something like - string[] ids = System.Web.HttpContext.Current.Request.Headers["logonID"].Split(',');

tree Over a year ago

dataType should be written ad datatype

Collectives™ on Stack Overflow

Pass request headers in a jQuery AJAX GET call

3 Answers 3

9 Comments

8 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

9 Comments

8 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related