# Passing header information to REST Get request using RESTAdapter

**URL:** <https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220>\
**Category:** Ember Data\
**Created:** [February 20, 2014, 12:53pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220 "2014-02-20T12:53:24Z")\
**Posts on this page:** 19\
**Page:** 1

<div class="post-metadata">

**Author:** ![mchan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/mchan/32/15510_2.png) [@mchan](https://discuss.emberjs.com/u/mchan)\
**Post date:** [February 20, 2014, 12:53pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/1 "2014-02-20T12:53:24Z")

</div>

I am trying to send a Get request to my client server using the RESTAdapter, and I am required to pass an AuthToken along with the request (as a header param) in order to be authorized. I’ve tested the Get request with AuthToken using Chrome Postman and it works just fine, but using the code below I always get error 401 unauthorized, can someone please tell me what I am doing wrong and how to send the AuthToken? Thanks

```
App.store = DS.Store.create({
    revision: 11,
    adapter: DS.RESTAdapter.extend({
        url: "http://api.clientdomain.com",
        headers: { 
           'Accept': 'application/json',
           'AuthToken': '58jdc60b-c891-9981-8821-939p0121609b'
        },
        ajax: function (url, type, hash) {
            hash.url = url;
            hash.type = type;
            hash.dataType = 'jsonp';
            hash.contentType = 'application/json';
            hash.context = this;

            if (hash.data && type !== 'GET') {
                hash.data = JSON.stringify(hash.data);
            }

            jQuery.ajax(hash);
        },
    })
});

```

---

<div class="post-metadata">

**Author:** ![jamalsoueidan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jamalsoueidan/32/234_2.png) [@jamalsoueidan](https://discuss.emberjs.com/u/jamalsoueidan)\
**Post date:** [February 20, 2014, 1:20pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/2 "2014-02-20T13:20:06Z")

</div>

You can actually do this.

```
$.ajaxSetup({
    headers: { 'x-my-custom-header': 'some value' }
});

```

This set headers for all requests.

---

<div class="post-metadata">

**Author:** ![jamalsoueidan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jamalsoueidan/32/234_2.png) [@jamalsoueidan](https://discuss.emberjs.com/u/jamalsoueidan)\
**Post date:** [February 20, 2014, 1:21pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/3 "2014-02-20T13:21:06Z")

</div>

or you can do it ember way.

```
DS.RESTAdapter.reopen({
  headers: { 
    "Accept": "application/json, text/javascript; q=0.01"
  }
});

```

---

<div class="post-metadata">

**Author:** ![mchan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/mchan/32/15510_2.png) [@mchan](https://discuss.emberjs.com/u/mchan)\
**Post date:** [February 20, 2014, 8:15pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/4 "2014-02-20T20:15:23Z")

</div>

@jamalsoueidan I’ve already tried doing it the ember way as shown in my question but it didn’t work…it returns error 401.

One thing thought not sure if it will make a difference (please excuse my ignorance), the API documentation include a call for authentication where I should send a payload to get the AuthToken which I’ve used in my Get request. But I am not sure if this is necessary as I’ve tried using Chrome Postman to process the Get request without first authenticating with payload and it worked just fine…make sense?

---

<div class="post-metadata">

**Author:** ![jamalsoueidan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jamalsoueidan/32/234_2.png) [@jamalsoueidan](https://discuss.emberjs.com/u/jamalsoueidan)\
**Post date:** [February 21, 2014, 10:03am UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/5 "2014-02-21T10:03:19Z")

</div>

Are you sure you have the correct ember-data version?

---

<div class="post-metadata">

**Author:** ![mchan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/mchan/32/15510_2.png) [@mchan](https://discuss.emberjs.com/u/mchan)\
**Post date:** [February 21, 2014, 7:57pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/6 "2014-02-21T19:57:58Z")

</div>

@jamalsoueidan I am not using the latest, I am using ember-1.0.0-rc.1 when I tried upgrading to latest, I got tons of errors. Do I have to use latest version?

---

<div class="post-metadata">

**Author:** ![jimbol](https://avatars.discourse-cdn.com/v4/letter/j/d6d6ee/32.png) [@jimbol](https://discuss.emberjs.com/u/jimbol)\
**Post date:** [April 22, 2014, 3:24pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/7 "2014-04-22T15:24:48Z")

</div>

I am also having this issue. The Ember way doesn’t seem to work for me. When I do this:

```
DS.RESTAdapter.reopen({
  headers: { 
    "Accept": "application/json, text/javascript; q=0.01"
  }
});

```

All the standard headers are removed and it uses the `OPTIONS` method instead of `GET`. On top of that the headers I have added never actually appear in the request headers.

---

<div class="post-metadata">

**Author:** ![jimbol](https://avatars.discourse-cdn.com/v4/letter/j/d6d6ee/32.png) [@jimbol](https://discuss.emberjs.com/u/jimbol)\
**Post date:** [April 22, 2014, 4:06pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/8 "2014-04-22T16:06:00Z")

</div>

I have found that adding `headers` does, in fact, add the headers **unless** there is also a `host` defined. I _am_ using the latest version of Ember Data.

Looking at the [RESTadapter](https://github.com/emberjs/data/blob/v1.0.0-beta.6/packages/ember-data/lib/adapters/rest_adapter.js#L13) the `ajaxOptions` method is what actually adds the headers. This is called by the `ajax` method. None of this seems to rely on the existence of a `host`.

@mchan do you also have a host defined?@jamalsoueidan does this shine some light? I’m trying to work this out still.

---

<div class="post-metadata">

**Author:** ![stevehorne](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/stevehorne/32/15374_2.png) [@stevehorne](https://discuss.emberjs.com/u/stevehorne)\
**Post date:** [April 22, 2014, 5:43pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/9 "2014-04-22T17:43:18Z")

</div>

I have successfully used this approach:

```
Ember.$.ajaxPrefilter(function(options, oriOpt, jqXHR) {
    jqXHR.setRequestHeader("someHeader", "someValue");
});

```

This approach allows you to dynamically change the header/value on the fly rather than being statically defined once, depending on your needs.

---

<div class="post-metadata">

**Author:** ![jimbol](https://avatars.discourse-cdn.com/v4/letter/j/d6d6ee/32.png) [@jimbol](https://discuss.emberjs.com/u/jimbol)\
**Post date:** [April 22, 2014, 5:56pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/10 "2014-04-22T17:56:30Z")

</div>

This has the same effect for me. It works great unless I set a `host`. As soon as I set a host the headers are lost.

---

<div class="post-metadata">

**Author:** ![rmartinez93](https://avatars.discourse-cdn.com/v4/letter/r/2bfe46/32.png) [@rmartinez93](https://discuss.emberjs.com/u/rmartinez93)\
**Post date:** [June 10, 2014, 7:58pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/11 "2014-06-10T19:58:46Z")

</div>

Headers worked for me in the following way:

```
App.store = DS.Store.create({
  adapter: 'application'	
});
App.ApplicationAdapter = DS.RESTAdapter.extend({
    headers: {
	"header" : "myheader"
    }
});
DS.RESTAdapter.reopen({
    host: 'http://localhost',
});

```

---

<div class="post-metadata">

**Author:** ![bahudso](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/bahudso/32/15559_2.png) [@bahudso](https://discuss.emberjs.com/u/bahudso)\
**Post date:** [August 26, 2014, 4:36pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/12 "2014-08-26T16:36:45Z")

</div>

I have not gotten any of these methods to work inserting headers with a host.

Defining the host seems to cancel out the insertion of the headers as well as change the request method to OPTIONS rather than GET.

---

<div class="post-metadata">

**Author:** ![rwjblue](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/rwjblue/32/9411_2.png) [@rwjblue](https://discuss.emberjs.com/u/rwjblue)\
**Post date:** [August 28, 2014, 2:21pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/13 "2014-08-28T14:21:46Z")

</div>

Headers can be a computed property as of 1.0.0-beta.8.

```javascript
// app/adapters/application.js

export default DS.ActiveModelAdapter.extend({
  headers: Ember.computed(function(){
    var token = Ember.$('meta[name="csrf-token"]').attr('content');

    return {"X-CSRF-Token": token};
  })
});

```

---

<div class="post-metadata">

**Author:** ![bahudso](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/bahudso/32/15559_2.png) [@bahudso](https://discuss.emberjs.com/u/bahudso)\
**Post date:** [August 28, 2014, 2:32pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/14 "2014-08-28T14:32:51Z")

</div>

I just tried your solution @rwjblue, but it still changes my request method to OPTIONS and does not add the new headers.

```
// app/adapters/application.js

import DS from 'ember-data';

export default DS.ActiveModelAdapter.extend({
	host: 'https://api.example.com',
	headers: Ember.computed(function(){
		return {"APIKEY": "abc123"};
	});
});

```

- Ember: 1.7.0
- Ember-CLI: 0.0.41
- node: 0.10.31
- npm: 1.4.24

---

<div class="post-metadata">

**Author:** ![rwjblue](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/rwjblue/32/9411_2.png) [@rwjblue](https://discuss.emberjs.com/u/rwjblue)\
**Post date:** [August 28, 2014, 2:37pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/15 "2014-08-28T14:37:47Z")

</div>

The `OPTIONS` request is likely a result of CORS (not ember-data directly).

> **[Cross-Origin Resource Sharing (CORS) - HTTP | MDN](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS)**
>
> Cross-Origin Resource Sharing (CORS) is an HTTP-header based mechanism that allows a server to indicate any origins (domain, scheme, or port) other than its own from which a browser should permit loading resources. CORS also relies on a mechanism by...

---

<div class="post-metadata">

**Author:** ![bahudso](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/bahudso/32/15559_2.png) [@bahudso](https://discuss.emberjs.com/u/bahudso)\
**Post date:** [August 28, 2014, 2:45pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/16 "2014-08-28T14:45:03Z")

</div>

So do I need to configure OAuth to handle CORS as described here even though I am not using ember-simple-auth:

> <https://stackoverflow.com/questions/24655329/setting-host-on-ds-restadapter-removing-ember-simple-auth-headers/24659469#24659469>

---

<div class="post-metadata">

**Author:** ![brendon](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/brendon/32/9560_2.png) [@brendon](https://discuss.emberjs.com/u/brendon)\
**Post date:** [September 18, 2014, 4:12am UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/17 "2014-09-18T04:12:50Z")

</div>

This just does not seem to be working. I’ve tried the examples that were given in the [documentation](http://emberjs.com/api/data/classes/DS.RESTAdapter.html#toc_headers-customization) to no avail. If I hard-code it without the function, they are inserted. If I try to make it dynamic - the code inside never executes (verified by logging to the console). Even if it isn’t dynamic like the examples, they don’t get added to the headers:

```
App.ApplicationAdapter = DS.RESTAdapter.extend({
	headers: function(){
		return {
			Authorization: 'CuzISaySo',
			Project: 'MyAwesomeProject',
		};
	}
});

```

I have validated that my CORS header is set to accept them. Not sure what else to do; seems like a bug due to the delta in behavior between the documentation and my real-world experience.

```
Ember : 1.7.0 
Ember Data : 1.0.0-beta.5 
Handlebars : 1.3.0
jQuery : 2.0.3 

```

---

<div class="post-metadata">

**Author:** ![jessesanford](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jessesanford/32/11631_2.png) [@jessesanford](https://discuss.emberjs.com/u/jessesanford)\
**Post date:** [November 2, 2015, 4:37pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/18 "2015-11-02T16:37:55Z")

</div>

I am almost positive the options header is sent from the browser itself because of the cross domain request. It does this to make sure that the requested domain has a cors policy to allow your current domain to make the request. If the response to the options request contains a valid cors policy the browser will then send the xhr request that you crafted. There is likely something wrong with your cors policy if your intended xhr request never makes it through.

---

<div class="post-metadata">

**Author:** ![jportner](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jportner/32/11791_2.png) [@jportner](https://discuss.emberjs.com/u/jportner)\
**Post date:** [December 10, 2015, 8:18pm UTC](https://discuss.emberjs.com/t/passing-header-information-to-rest-get-request-using-restadapter/4220/19 "2015-12-10T20:18:02Z")

</div>

I was having this same issue and none of the above solutions fixed it. Turns out if you are sending an ajax/XHR request to a different domain, your browser will automatically send a “preflight” HTTP OPTIONS request before sending your actual request.

So, as other folks alluded, your backend has to respond to that preflight correctly before the browser will send the actual request with your custom headers.

Here’s what happened to me- my backend responded to the preflight request with the right headers and a 401 code (because the requested route required authorization). My browser decided to respond by sending the real request _without my custom headers_. So, it APPEARED that my browser had accepted the preflight response, but in reality it had not. I had to make sure my backend responded to the preflight request with a 200 code, that fixed my problem! Now my browser responds with the actual request and no longer discards my custom headers.
