superagent set custom request headers es6 not Access-Control-Request-Headers

Question

I know this is addressed in this post but I am still having trouble setting a custom header using ES6 and am wondering if anyone has run into this issue? The problem is when is set the header using .set I only set the Access-Control-Request-Header to the label I want to set it and the value is lost. I want to set a custom field on the request header using superagent and not sure how.

Let's say I am running this in my app (client)

import ajax from 'superagent'

ajax.get(baseURL + "/query/")
    .query({q: "SELECT Id FROM USER WHERE Id=" + id})
    .set('X-Authorization', 'Oauth ' + token)
    .set('Content-Type', 'application/json')
    .end((error, response) => {
        if(errro) { console.log(error); }
    }

the header the get request makes contains:

Access-Control-Request-Headers:content-type, x-authorization

under Request Headers in the network tab of the browser debugger. I want to set the headers of the get so that under Request Headers in the network tab of the browser dubugger I see:

X-Authorization:  some_token
Content-Type: application/json

Does anyone have any ideas on how I can set the Request Headers to have any field/value I want using ES6 and superagent?

thanks to all in advanced!

When I run the code above, I get Access-Control-Request-Headers:content-type, x-authorization as the header. I want to get X-Authorization: some_token Content-Type: application/json as my header. Why does .set put the headers under Access-Control-Request-Headers? — poutyboi, Aug 21 '16 at 23:49
you didn't use the spooning answer `var request = require('./myagent');` — qballer, Aug 21 '16 at 23:52
yes I forgot it in the example, but thats not it. I still am not able to set the header fields. When i use ./myagent i get Uncaught TypeError: request.get is not a function. when I don't the header is not set correctly — poutyboi, Aug 22 '16 at 00:03
`Access-Control-Request-Headers` is present in preflight requests only. Those on the other hand do not contain the "actual" headers. It seems you are not familiar with CORS. What's the actual problem here? — a better oliver, Aug 22 '16 at 06:56

qballer · Accepted Answer · 2016-08-22T00:39:37.310

1

try adding the following code to your script, before get is called.

ajax._defaultHeaders = {};

function isObject(obj) { return Object(obj) === obj; };

ajax.set = (function (field, value) {
   if (isObject(field)) {
      for(var key in field) this.set(key, field[key]);
      return this;
   }
   this._defaultHeaders[field] = value;
   return this;
}).bind(ajax)

edited Aug 22 '16 at 00:39

answered Aug 21 '16 at 23:57

qballer

2,033
2
22
40

The OP didn't mention they are getting a syntax error. This doesn't really address their issue. – Felix Kling Aug 21 '16 at 23:59
I fixed my answer. – qballer Aug 22 '16 at 00:11
nice thank you, I am trying it out. I am getting an error, I think it's due to having the code in with es6 and it is not recognize isObject Uncaught ReferenceError: isObject is not defined – poutyboi Aug 22 '16 at 00:17
nice thanks, but now it gives me defaultHeaders is not defined. Is there a safe place in superagent I can plant this? – poutyboi Aug 22 '16 at 00:23
I am still not getting the header set. this changes the behavior but none of the fields I want to set in the header at present or getting populated. – poutyboi Aug 22 '16 at 00:38
1

Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/121493/discussion-between-qballer-and-user1807880). – qballer Aug 22 '16 at 00:39
You might want to elaborate on the issue and how / why your solution solves it. Simply posting code is not useful. – Felix Kling Aug 22 '16 at 00:43
we are discussion this and then I will elaborate. – qballer Aug 22 '16 at 00:44
that function you are adding looks like it is in the lib already, maybe without the defaultHeaders getting set. So is it that superagent doesn't work with es6? as least .set doesn't work? I am not sure you are still in the chat – poutyboi Aug 22 '16 at 01:15

score 1 · Answer 2 · answered Jan 14 '21 at 07:59

used to have similar problem with Spring Boot application and React JS on frontend.

When I dump headers that were attached to RQ I used to see only headers with pattern:

Access-Control-Request-Headers:content-type, x-authorization, etc...

however that was problem connected with my backend application, NOT with superagent on frontend. I had to turn on cors() in WebSecurityConfig to look similar to this one:

@Override
protected void configure(HttpSecurity httpSecurity) throws Exception {
    httpSecurity.csrf().disable()
            .cors().and()
            .authorizeRequests().antMatchers("/auth/login", "/auth/register").permitAll().
            anyRequest().authenticated().and().
            exceptionHandling().authenticationEntryPoint(jwtAuthenticationEntryPoint).and().sessionManagement()
            .sessionCreationPolicy(SessionCreationPolicy.STATELESS);

so as you can see problem was with Spring configuration, not with Superagent,

Regards R.

superagent set custom request headers es6 not Access-Control-Request-Headers

2 Answers2