Localhost being injected into the pathname by Axios

Question

Localhost being injected into the pathname by Axios

I am trying to implement an axios request using their official documentation.

Here is my code snippet:

const REFERRAL_API_URL= "https://referrals.gen.com"


export function createReferral() {
  axios({
    data: {},
    headers: {
      'Content-Type': 'application/json',
      ApiKey: ReferralApiKey,
    },
    method: 'post',
    url: `${REFERRAL_API_URL}/api/ReferralMasters`,
    withCredentials: true,
  })
    .then(function (response) {
      console.log(response)
    })
    .catch(function (error) {
      console.log(error)
    })
}

However, when I execute the function, I encounter a 404 error message:

NOT FOUND https://localhost:3000/referrals.gen.com/api/ReferralMasters

I'm confused as to why localhost:3000 is included in the URL path. Any ideas on what could be causing this issue?

javascript axios

Answer 1

Answer №1

I encountered a similar issue and managed to resolve it using the following steps. Start by creating an API client using axios.create(), as shown in the code snippet below:

const apiClient = axios.create({
    baseURL: REFERRAL_API_URL,
    headers: {
        'Content-Type': 'application/json',
        ApiKey: ReferralApiKey
    }
});

Once you have set up the client, proceed to send a request like so:

const config = {
    url,      // Assuming it is "ReferralMasters"
    method,   // Can be "GET", "POST", "PUT", or "DELETE"
    data,     // Custom body
    params    // Object with key-value pairs corresponding to required parameters
};

const response = await apiClient.request(config);

To further customize your configuration, refer to the axios documentation.

Answer 2

I encountered a similar issue and managed to resolve it using the following steps. Start by creating an API client using axios.create(), as shown in the code snippet below:

const apiClient = axios.create({
    baseURL: REFERRAL_API_URL,
    headers: {
        'Content-Type': 'application/json',
        ApiKey: ReferralApiKey
    }
});

Once you have set up the client, proceed to send a request like so:

const config = {
    url,      // Assuming it is "ReferralMasters"
    method,   // Can be "GET", "POST", "PUT", or "DELETE"
    data,     // Custom body
    params    // Object with key-value pairs corresponding to required parameters
};

const response = await apiClient.request(config);

To further customize your configuration, refer to the axios documentation.

Localhost being injected into the pathname by Axios

Answer №1

Similar questions

Searching for a streamlined approach to sending out numerous HTTP requests in a node.js environment

What is the best way to repair a react filter?

When you use ReactDOM.render inside a <div>, it does not instantly generate HTML code

Set a timeout for a single asynchronous request

Associating mongoose object with a DTO object in an Express.js application

Setting an Angular Directive on a dynamically generated DOM element using Javascript

Guide on how to clear and upload personalized information to Stormpath

Tips for receiving a success notification post form submission on CodeIgniter

What is the best way to access the display property of a DOM element?

What is the best way to insert additional divs into a box div that contains tabs?

Vue js version 2.5.16 will automatically detect an available port

The error message "this.props.navigation" is not defined and cannot be evaluated as an object

The React application encounters errors when the API URL provided is incorrect

Implement validation for dynamically generated input fields in JavaScript and PHP

Employing AJAX, execute a synchronous function asynchronously (Javascript)

Exposing external variables within the setInterval function

CORS blocking Axios POST request to Heroku causing a Network Error 503

Detecting collisions on a tile map using only JavaScript

Searching for the desktop location using Node.js

Here is a step-by-step guide on how to use JavaScript to eliminate the page title, URL, date and