Sending Request body for GET method in AXIOS throws error

I have a React application where I am changing POST method to GET with the request body as it is. It works fine with POST request however when I change the method to GET, it gives me error-

message: "org.springframework.http.converter.HttpMessageNotReadableException: Required request body is missing: public 

My Front End Code-

export const setData = (getData)  => dispatch => {
    axios({
        method: 'GET',
        url: 'http://localhost:8080/api',
        headers: {
          'Content-Type': 'application/json'
        },
        data: getData
      })
      .then (response => {
      dispatch({
        type: API_DATA, 
        payload: response.data
      })
      dispatch({
        type: SET_SEARCH_LOADER, 
        payload: false
      })
      })
      .catch(function(error) {       
      })
}

Can someone let me know what I am missing here. As per my understanding, http allows to have a request body for GET method.

As per my understanding, http allows to have a request body for GET method.

While this is technically true (although it may be more accurate to say that it just doesn't explicitly disallow it), it's a very odd thing to do, and most systems do not expect GET requests to have bodies.

Consequently, plenty of libraries will not handle this.

The documentation for Axois says:

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

Under the hood, if you run Axios client side in a web browser, it will use XMLHttpRequest. If you look at the specification for that it says:

client . send([body = null])

Initiates the request. The body argument provides the request body, if any, and is ignored if the request method is GET or HEAD.

If you want to send parameters with get request in axios, you should send parameters as params.

If you want to set "Content-type":"application/json" and send params with get request, you should also send an empty data object.

For example:

const AUTH_TOKEN = 'Bearer token'
const config = {
    headers: {
        'Content-Type': 'application/json',
        'Accept': 'application/json',
        'Authorization': AUTH_TOKEN,
    },
    data: {},
    params: {
        "post_id": 1
    }
}
axios.get("http://localhost/api/v1/posts/", config)