Stop sending preflight requests from axios.post

Question

I have my micro-service developed using spring-boot and spring security and frontend is designed on react-hooks. Now, while I am send some data to my micro-service using axios.post method, it send CORS preflight method i.e. options method because axios by default send content-type as application/json and application.json leads to send options request to server before any other request.

I have tried sending my request with different headers and content types as 'application/x-www-form-urlencoded' also I have used @cross-origin(*) at my server end.

const config = {
                    headers: {
                    'Content-Type': 'application/json'
                    }
                }

            const response = await axios.post(ps.user_ms_url+ps.user_login,
                {
                    username:values.email,
                    password:values.password
                    // headers:{'tokenvalue':'token'}

                },
                config);

I expect my browser to send only post request to the server, for that I am ready to change my headers as well. Any help will be appreciated. Thanks in advance!

Answer 1

I found the solution for my query. As I mentioned above, our browser sends preflight request (means options request) before any other request if our request is not simple (here simple means: if request contains content-type : application/json or custom headers etc) and if we are sending this request to some other domain/ URL.

And our axios.post method carries content-type as application/json by default, that's why, my browser was sending multiple requests (means preflight request before any other request).

Now, I have changed my request content-type to application/x-www-form-urlencoded by sending data as params, as shown below:

     var params = new URLSearchParams();
                params.append('username', values.email);
                params.append('password', values.password);

            const response = await axios.post(ps.user_ms_url+ps.user_login,
                params);

And handling this request at backend using @ModelAttribute annotation (Spring-boot). So, keeping request simple can stop preflight requests.