When interacting with API, the custom Header key always bee lowercase. I'm use Fetch, Axios, XMLHttpRequest and Frisbee (javascript network library) but the key always lowercase

My snippet code like this (with fetch() method), The key I'm push is: 'Token-Api' but the server receive: 'token-api', so it's show the error 401. It's work with Postman:

 const request = 'https://abcxyz';
 fetch(request, {
   method: 'GET',
   headers: {
     'Content-Type': 'application/json',
     'Token-Api':'...abcxyz....'
   }
 }).then((response) => {
            log(abcxyz)
        })...

What do I need to do?

When interacting with API, the custom Header key always bee lowercase. I'm use Fetch, Axios, XMLHttpRequest and Frisbee (javascript network library) but the key always lowercase

My snippet code like this (with fetch() method), The key I'm push is: 'Token-Api' but the server receive: 'token-api', so it's show the error 401. It's work with Postman:

 const request = 'https://abcxyz';
 fetch(request, {
   method: 'GET',
   headers: {
     'Content-Type': 'application/json',
     'Token-Api':'...abcxyz....'
   }
 }).then((response) => {
            log(abcxyz)
        })...

What do I need to do?

• javascript
• reactjs
• react-native
• axios
• fetch-api

2 Answers 2

you can read this post: Are HTTP headers case-sensitive?

According to RFC 2616, HTTP headers should be case-insensitive. So this is not the bug of the libraries you mention above. You should fix the server to treat Token-Api and token-api at the same way.

You can actually solve this quite easily with another header:

sensitive: true