CODEWITHSUNDEEP
reactjsaxioshttp-headerscontentfulcontentful-api
mukund
mukund

Reputation: 603

Delete default header for Contentful CreateClient API request

I am integrating Contentful as a CMS to my react web app. The npm package contentful allows accessing the content stored using createClient method. This method uses Axios to create requests to content delivery API.

client = contentful.createClient({
        space: *** ,
        accessToken:  *** 
})

// getting data 
fetchPosts = () => this.client.getEntries()

But the problem is that - I already use Axios within my app,and every request originated through my react client includes the default common header auth-token. Due to this, I get the following error for my HTTP request - Request header field auth-token is not allowed by Access-Control-Allow-Headers in preflight response.

I tried setting the whole header as an empty object and setting auth-token as undefined but it does not help because my request would still contain the key for my default header -

client = contentful.createClient({
        space: *** ,
        accessToken:  ***, 
        headers: {} 
})

// OR

client = contentful.createClient({
        space: *** ,
        accessToken:  ***, 
        headers: { 'auth-token' : undefined } 
})

I came across this post and it answers how to modify one request to not include a common header but I am not sure how I can use this to modify createClient method. Appreciate your help.

Upvotes: 1

Views: 505

Answers (1)

mukund
mukund

Reputation: 603

Tried the following without using contentful's javascript SDK and it works :

  1. Modify the instance of Axios for that particular request to delete your default headers
  2. Access content delivery API using base (+ plain) URLs.
const url = 
      `${baseUrl}/spaces/${spaceId}/environments/master/entries?access_token=${accessToken}` ;

axios.get(url, {
      transformRequest: (data, headers) => {
          delete headers.common['auth-token'];
          return data;
   }
})

Upvotes: 2

Related Questions