Cecilia Wong
Cecilia Wong

Reputation: 33

Fetching from API in React with key in headers, returning 406 not acceptable

I'm trying to fetch from an API, using an API key, but keep getting 406 Not Acceptable. I can get the request to work in Postman, but not in the code. What could be wrong here? I've tried all sorts of ways of including my info in headers, this is just my last attempt.

componentDidMount() {
    fetch("my-api", {
      method: "GET",
      headers: ({
      Accept: "application/json",
      "Content-Type": "application/json",
      "X-Api-Version": 20161108,
      Authorization: {
          Token: "my-api-key",
      }
     }),
      body: JSON.stringify()
    }).then(response => {
      if (response.status === 201) {
        console.log(response)
        return response.json()
      } else {
        console.log("oh no!", response.status === 404)
      }
    })
  }

Upvotes: 1

Views: 1653

Answers (1)

Cecilia Wong
Cecilia Wong

Reputation: 33

I figured it out. This ended up working:

componentDidMount() {
        fetch("my api", {
          method: "GET",
          headers: ({
          Accept: "application/vnd.api+json",
          "Content-Type": "application/json",
          "X-Api-Version": 20161108,
          Authorization: "Token my token",
         }),
          body: JSON.stringify()
        }).then(response => {
          if (response.status === 200) {
            console.log(response)
            return response.json()
          } else {
            console.log("oh no!", response.status === 404)
          }
        })
      }

Upvotes: 1

Related Questions