401 API Authentication Failed using POST Method

Question

I am implementing an API which is based on POST method. Now, I have tried axios as well as fetch (promise) method but I am constantly having this error of "401 Authentication Failed".

For testing, I defined the data values to be sent into this.state as default values.
apiKey and userId are defined as var outside the React.Component.
Instead of using inbuilt btoa function, I am using the one from npm directory which is imported on the top.

Here is the React Component code:-

constructor(props) {
    super(props);

    this.state = {
      day: 1,
      month: 2,
      year: 2019,
      hours: 12,
      minutes: 59,
      tzone: 5.5,
      lat: 19.22,
      lon: 25.2
    };
  }

  componentDidMount() {

      const options = {
      headers: {
        "Authorization": "Basic" + btoa(userId+":"+apiKey),
        "Content-Type":'application/json'
      }
    };

      const url = `https://json.astrologyapi.com/v1/current_vdasha`
      const data = this.state

      fetch(url, { method: 'POST', 
        body: JSON.stringify(data), 
        headers: options })
        .then(res => res.json())
        .catch(error => console.error('error ---', error.message))
        .then(response => console.log('Success:', response));
  }

Any help is appreciated. Thank you.

@AthanasiosKataras What exactly should I provide you with? Here is what the API devs provide for reference -- var userId = ''; var apiKey = ''; var data = 'JSON Request Data'; var request = $.ajax({ url: "https://json.astrologyapi.com/v1/"+api, method: "POST", dataType:'json', headers: { "authorization": "Basic " + btoa(userId+":"+apiKey), "Content-Type":'application/json' }, data:JSON.stringify(data) }); // Returns A promiss return( request.then( function(resp){ return resp; }, function(err){ return err; })); } — Vaibhav Dwivedi
– Vaibhav Dwivedi, Commented Jan 31, 2020 at 6:39

ugain jain · Accepted Answer · 2020-01-31 06:23:40Z

2

In the header part of the request try adding space after "Basic" which should look like this : '''

const options = {
headers: {
    "Authorization": "Basic " + btoa(userId+":"+apiKey),
    "Content-Type":'application/json'
  }
};

''' As the authentication header first expects the type of authorization followed by space and then the api key

answered Jan 31, 2020 at 6:23

ugain jain

212 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vaibhav Dwivedi Over a year ago

I checked that out before also but it doesn't seem to fix the error.

Ali · Accepted Answer · 2020-01-31 08:31:31Z

0

When you pass headers to the fetch function, you pass it inside another object.

In the fetch function, try to change headers: options to headers: options.headers.

edited Jan 31, 2020 at 8:31

Ali

2,7643 gold badges37 silver badges62 bronze badges

answered Jan 31, 2020 at 6:21

Maksim Varkus

11 bronze badge

2 Comments

Vaibhav Dwivedi Over a year ago

It seems like this was part of the fix but it produces 405 Method not allowed error.

Vaibhav Dwivedi Over a year ago

POST json.astrologyapi.com/v1/current_vdasha 405 (Method Not Allowed)

Collectives™ on Stack Overflow

401 API Authentication Failed using POST Method

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related