Skip to content
Advertisement

Why I can get and api data with fetch and not with axios?

I got this test code:

import axios from 'axios';

const readWithAxios = async (basicAuth, user, passwd) => {
    let options = {
        auth: {
            username: user,
            password: passwd
        },
        headers: { "Content-Type": "application/json"},
        withCredentials: true
    };

    return axios.get('https:///geolite.info/geoip/v2.1/country/me?pretty', options);
}

const readWithFetch = (basicAuth) => {
    return new Promise(res=>{
        let headers = new Headers();
        headers.set('Authorization', basicAuth);
        
        fetch('https://geolite.info/geoip/v2.1/country/me?pretty', {
            method: 'GET',
            headers: headers,
        }).then(response => res(response.json()));
    })
}

const readData = async () => {
    let user = '<my_api_user>';
    let passwd = '<my_api_key>';
    let basicAuth = 'Basic ' + Buffer.from(user + ":" + passwd).toString('base64');

    let geoData;
    
    //geoData = await readWithFetch(basicAuth);
    geoData = await readWithAxios(basicAuth, user, passwd);
        
    console.log(geoData);
}
readData();

I’m trying to understand why readWithFetch works fine and axios gets connection refused. It’s a simple basic auth… nothing fancy.

I’ve tried all these readWithAxios versions:

version 1

const readWithAxios = async (basicAuth, user, passwd) => {
    let options = {
        auth: {
            username: user,
            password: passwd
        },
        headers: { "Content-Type": "application/json"},
        withCredentials: true
    };

    console.log('options', options);
    return axios.get('https:///geolite.info/geoip/v2.1/country/me?pretty', options);
}

version 2

const readWithAxios = async (basicAuth, user, passwd) => {
    let options = {
        auth: {
            username: user,
            password: passwd
        },
        headers: { "Content-Type": "application/json", 'Authorization': basicAuth},
        withCredentials: true
    };

    console.log('options', options);
    return axios.get('https:///geolite.info/geoip/v2.1/country/me?pretty', options);
}

version 3

const readWithAxios = async (basicAuth, user, passwd) => {
    let options = {
        method: 'GET',
        url: 'https:///geolite.info/geoip/v2.1/country/me?pretty',
        auth: {
            username: user,
            password: passwd
        },
        headers: { "Content-Type": "application/json", 'Authorization': basicAuth},
        withCredentials: true
    };

version 4

    return axios(options);
}

const readWithAxios = async (basicAuth, user, passwd) => {
    let options = {
        method: 'GET',
        url: 'https:///geolite.info/geoip/v2.1/country/me?pretty',
        headers: { "Content-Type": "application/json", 'Authorization': basicAuth},
        withCredentials: true
    };

    return axios(options);
}

What is the correct way to write readWithAxios ?

Advertisement

Answer

You have a triple slash in https:///geolite in the Axios versions. It should be https://

User contributions licensed under: CC BY-SA
1 People found this is helpful
Advertisement