Trying to send data in the body of a Axios GET to use in Django backend, but print of request.body is empty

Question

According the Axios, this should be possible:

https://github.com/axios/axios/issues/462#issuecomment-252075124

I have the following and pos_title does have a value.

export function getQuery(pos_code, id) {
    if (id === 94) {
        var strArray = pos_code.split(' - ');
        pos_code = strArray[0];
        var pos_title = strArray[1];
    }
    return function(dispatch) {
        axios.get(
            `${URL}/api/survey/${(id)}/results/${(pos_code)}/`,
            { 
                headers: { 
                    'Content-Type': 'application/json',
                    'Authorization': 'JWT ' +  sessionStorage.getItem('token')
                },
                data: {
                    body: pos_title
                }
            }
        )
        .then(response => {
            dispatch({
                type: QUERY,
                payload: response.data
            })
        })
        .catch(error => {
            console.log(error);
        }) 
    }
}

In the corresponding views.py , the print(body_data) is empty:

class GetQueryDataAPIView(APIView):
    permission_classes = [IsAuthenticated]

    def get(self, request, *args, **kwargs):
        data = {'id': request.user.id}
        if kwargs:
            data['survey_id'] = kwargs.get('survey_id')
            data['pos_code'] = kwargs.get('pos_code')
        if data['survey_id'] == 94:
            body_unicode = request.body.decode('utf-8')
            body_data = json.loads(body_unicode)
            print(body_data)
        serializer = GetQueryDataSerializer(data=data)
        if serializer.is_valid(raise_exception=True):
            return Response(serializer.data, status=HTTP_200_OK)
        return Response(serializer.errors, status=HTTP_400_BAD_REQUEST)

Answer 1

If it's possible to modify your API URL, add pos_title as a query parameter. This will get around any issues you may have in relation to sending a request body in a GET request. If you must send a request body, it sounds like you should be using a PUT request.

Answer 2

As Keith Brewster, Axios uses XMLHttpRequest which does not support sending data in the body of a request. One solution would be to do what David Ryan suggested and add pos_title to part of the URL. This creates some headaches though if there are spaces in the pos_title which there are in my case.

However, in my case, I decided to do filtering on the client-side, so keeping things as they were, and filtering the response was sufficient to resolve my issue.

Answer 3

For anyone coming to the same question I am posting the reply using your code:

You have to provide params with the get request like.

export function getQuery(pos_code, id) {
if (id === 94) {
    var strArray = pos_code.split(' - ');
    pos_code = strArray[0];
    var pos_title = strArray[1];
}
return function(dispatch) {
    axios.get(
        `${URL}/api/survey/${(id)}/results/${(pos_code)}/`,
        { 
            headers: { 
                'Content-Type': 'application/json',
                'Authorization': 'JWT ' +  sessionStorage.getItem('token')
            },
            params: {
                'title': pos_title
            }
        }
    )
}

}

And in the django part one can get the query_params as below:

def get(self, request, *args, **kwargs):
    title = request.query_params['pos_title']