How to do axios.get when the url is password protected in react native? - react-native

Question

I am trying to do axios.get. When I put the url on browser and hit enter browser assk me username and password. But I don't know how to set the password and username in axios header in a get method. The Swagger UI is http://api.myslambook.in/swagger/#
This is my code:
import axios from 'axios';
import base64 from 'react-native-base64'
export function FriendRequests ( ) {
state = {
serverData: [],
};
const tok = 'myusername:mypassword';
const hash = base64.encode(tok);
const Basic = 'Basic ' + hash;
axios.get('http://api.myslambook.in/users', {headers : { 'Authorization' : Basic }})
.then(res => {
const serverData = res.data;
this.setState({ serverData });
})
.catch(err => console.log(err));
}
I am getting this error in console:
Request failed with status code 401.
Can anyone help me? Thanks in advance.

Answer 1

For basic authentication the auth object can be used:
axios.get('http://api.myslambook.in/users', {
auth: {
username: 'janedoe',
password: 's00pers3cret'
}
}).then(res => {
const serverData = res.data;
this.setState({serverData});
}).catch(err => console.log(err));
to fix the Can't find variable: btoa error:
npm i -S base-64
and add the following to index.js:
import {decode, encode} from 'base-64'
if (!global.btoa) {
global.btoa = encode;
}
if (!global.atob) {
global.atob = decode;
}
Checkout the docs: https://github.com/axios/axios#request-config