"message": "Network Error", "name": "AxiosError",

Question

I have used a full project with concurrent using vuejs and calling an api request using axios post request my request is

axios({ method: "POST", url: http://abcd.com:5000/start-recording?roomId=${this.roomId}, headers: { 'Access-Control-Allow-Origin': '*' }, }) .then(function (response) { console.log(response) }) .catch(function (error) { console.log(error) });

but it gives me a network error as below

{ "message": "Network Error", "name": "AxiosError", "config": { "transitional": { "silentJSONParsing": true, "forcedJSONParsing": true, "clarifyTimeoutError": false }, "transformRequest": [ null ], "transformResponse": [ null ], "timeout": 0, "xsrfCookieName": "XSRF-TOKEN", "xsrfHeaderName": "X-XSRF-TOKEN", "maxContentLength": -1, "maxBodyLength": -1, "env": { "FormData": null }, "headers": { "Accept": "application/json, text/plain, /", "Access-Control-Allow-Origin": "*" }, "method": "post", "url": "``http://abcd.com:5000/start-recording?roomId=3503``" }, "code": "ERR_NETWORK", "status": null }

i was trying to resolve this issue through out the day please if someone could help it would be a great help

Thank you in Advance

Note - this issue is not occuring in local but when we use it in server this happens and when i call the api through the postman it works

I was accepting a response that recording started

Answer 1

I think this issue occurs because you are not sending a body with your POST request. Because of this the Content-Type is set to something else than application/json which the server only accepts so it throws back an error to you. I think sending an empty object in the body will fix it. You can also set the header in your request to contain Content-Type: application/json. I think why it only happens on server and not on local is because your webserver is changing the request before sending it by appending Content-Type to it.