How to send body data and headers with axios get request?

Question

I've tried

axios.get(url, {headers:{},data:{}}) 

But it doesn't work with this.

Answer 1

const DELIVARAY = process.env.DELIVARAY;
const ekshop_delivary_api_key = process.env.DELIVARAY_API_KEY;
const ekshop_delivary_api_secret = process.env.DELIVARAY_API_SECRET;

 export const axios_parcel_track = (method: any, data: string, url: string) => {
  const options = {
    method: method,
    headers: {
      "API-SECRET": ekshop_delivary_api_secret,
      "API-KEY": ekshop_delivary_api_key,
    },
    data: { parcel_no: data }, // parcel_no is my db field
    url: DELIVARAY + url,
  };

  return { ...options };
};

here method = "get" ; data ="string" ; url="string/string" ;

passed through with extra data. here data goes through body .as like post request.

Answer 2

As I see it you can't as the data-property seems to be ignored for GET. In the official documentation we find:

// `data` is the data to be sent as the request body
// Only applicable for request methods 'PUT', 'POST', 'DELETE', and 'PATCH'

So you cannot put it in the config-object. And the signature of the axios#get-method does not provide a data parameter.

Answer 3

As far as I know you can't send body data with GET request. With get you can have only Headers. Just simply change to POST and then you can do something like this :

const bodyParameters = {
      key: "value",
    };
    const config = {
      headers: { Authorization: `Bearer ${userToken}` }, 
    };
      axios.post("http://localhost:5000/user", bodyParameters, config)
      .then((res)=> {
       console.log(res)
      })
      .catch((err) => console.log(err));
  };

or if you want to send headers with GET request

axios.get('/user', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  })
  .then(function () {
    // always executed
  });  

Answer 4

data is the data to be sent as the request body.

Only applicable for request methods 'PUT', 'POST', 'DELETE , and 'PATCH'

https://stackoverflow.com/a/54008789

Answer 5

You can send data in a get request by using the config object and the params option of the config object. This is a workaround and it works, but on the server the data sent is available as request.query not as request.body. Based on the example below you would access your params data on your server using request.query.user_id. It should be noted that using this method will also append the params to your request url which could have unintended consequences based on your specific situation. For example, the url for the request below would be sent as example.com?user_id=1234. You can read more about the axios request config here.

axios.get(
    'example.com/',
    {
        params: { user_id: 1234 },
        headers: {
          Authorization: `Bearer ${token}`,
          'Content-Type': 'application/json',
        },
    },
  );

Answer 6

yeah, it's true it doesn't work to send body in Axios get even if it works in the postman or the backend.

Answer 7

There is no field related to body in get method in axios you can transfer data by get the data in query in URL like this:

axios.get(`url?data=${JSON.stringify(data)}`, {headers:{}})

Answer 8

You should use POST requests instead. It allows you to send data in the request body, which is not visible in the URL. This can be beneficial so as to not expose your information. Just like this:

axios.post(URL,{},{headers: {}});

Answer 9

You can try this:

const getData = async () => {
    try {
        const response = await axios.post(`https://jsonplaceholder.typicode.com/posts`, {
            method: 'POST',
            body: JSON.stringify({
                id: id,
                title: 'title is here',
                body: 'body is here',
                userId: 1
            }),
            headers: {
                "Content-type": "application/json; charset=UTF-8"
            }
        })
            .then(response => response.json())
            .then(json => console.log(json));
        console.warn(response.data);
    } catch (error) {
        console.warn(error);
    }
}