0

I'm experimenting with spring boot to learn. So I want to send a custom header to my backend spring boot server without using Spring Security. With curl it goes like this:

curl http://localhost:8080/data -H "Batman: Forever"

In my spring app I have a custom filter:

@Configuration
public class MyFilter extends OncePerRequestFilter {
    private final Logger log = LoggerFactory.getLogger(getClass());
    @Override
    protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException {
        String header = request.getHeader("Batman");
        log.info("Batman: "+ header);
        request.getHeaderNames().asIterator().forEachRemaining(s -> log.info(s));
        filterChain.doFilter(request, response);
    }
}

With curl I recieve the header 'Batman' but not with angular that goes like this:

  getData(): Observable<any> {
    const url = 'http://localhost:8080/data'
    let headers_obj = new HttpHeaders()
    headers_obj.append('Content-Type', 'application/json')
    headers_obj.append('Batman', 'Forever')
    const httpOptions = {
      headers: headers_obj,
    }
    console.log('Provided user: ', this.username)
    return this.http.get<any>(url, httpOptions)
  }

I spent hours googling the issue without success. Thank you for any help

Gastón Schabas
  • 2,153
  • 1
  • 10
  • 17
Nadirspam
  • 161
  • 7
  • could you provide what are the logs of executing your spring app? have you validated that the request that you are doing from angular is sending the request with the custom header? have you tried sending a standard header from angular and it was also ignored? – Gastón Schabas May 30 '23 at 18:35
  • @Gastón Schabas. I do not know how to verify that angular is sending the request with the custom header> I don't have experience. With curl I get the following log from spring: ... INFO 29158 --- [nio-8080-exec-4] yFilter$$EnhancerBySpringCGLIB$$4cd85bf3 : h: batman – Nadirspam May 30 '23 at 18:46
  • you have two options. One could be run the app in the browser and with the devloper tools check what are the requests you are doing. In chrome you can do that in the [network](https://developer.chrome.com/docs/devtools/network/). Another option could be to add some logs and check the [console](https://developer.chrome.com/docs/devtools/console/) of the broswer. Another one could be to write automated test (such as unit or integration tests) that validates the request sent by your code – Gastón Schabas May 30 '23 at 18:50
  • Assuming Angular is not sending the headers, what to do about it. Actually before sending 'Batman' I wanted to send "Authorization" header : "Basic ..." but it didn't work – Nadirspam May 30 '23 at 18:59
  • 1
    If angular is not doing what you are expecting, you should fix it. If you need some help with that, you should need to edit your post or create a new question – Gastón Schabas May 30 '23 at 20:15

1 Answers1

1

Thanks to the instructions of @Gastón Schabas , I made a change to my code in Angular and the problem is solved:

  getData(): Observable<any> {
    const url = 'http://localhost:8080/data'
    return this.http.get<any>(url, { headers: { Batman: 'Forever' } })
  }

I got the solution from the following link: Adding a HTTP header to the Angular HttpClient doesn't send the header, why?

As for the reason why the first code does not work, I don't know.

Nadirspam
  • 161
  • 7