[javascript] Getting request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource

I am trying to send an Ajax request to a Tomcat server from my application, but I am getting this error (my web app is running on Chrome):

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 403.

I have tried using

'Access-Control-Allow-Origin' : 'http://localhost:8080/app',

but it didn't work.

My Ajax code:

 var arr = [1];
   $.ajax({ 
   url: 'http://localhost:8080/app',
   type: 'POST',
   contentType:'application/json',
   headers: {
   'Access-Control-Allow-Origin' : 'http://localhost:8080',
   },
       data: JSON.stringify(arr[0]),
       success: function(data){
        //On ajax success do this
             alert(data);
          }
     });

This question is related to javascript ajax

The answer is


In case of Request to a REST Service:

You need to allow the CORS (cross origin sharing of resources) on the endpoint of your REST Service with Spring annotation:

@CrossOrigin(origins = "http://localhost:8080")

Very good tutorial: https://spring.io/guides/gs/rest-service-cors/