title: How to get rid of No 'Access-Control-Allow-Origin' header is present on the requested resource error in java based web-service server
body: <p>I'm trying to build a webservice (Java based server and Javascript base client) I only need to send a Post request with json data and I need to get a post response with json data from server.Since client and server have different domains I think cors need to be supported. Up to now, I've implemented these: (My client implementaion is almost same with <a href="http://www.html5rocks.com/en/tutorials/cors/" rel="nofollow">html5 rocs tutorial</a>) </p>
  
  <p><strong>Web service client (js):</strong></p>
  
  <pre><code>    // I call client = new WSclient() in one of my js files   
      WSclient=function(){
        makeCorsRequest();
      }
  
      // Create the XHR object.
      function createCORSRequest(method, url) {
        var xhr = new XMLHttpRequest();
        if ("withCredentials" in xhr) {
          // XHR for Chrome/Firefox/Opera/Safari.
          xhr.open(method, url, true);
        } else if (typeof XDomainRequest != "undefined") {
          // XDomainRequest for IE.
          xhr = new XDomainRequest();
          xhr.open(method, url);
        } else {
          // CORS not supported.
          xhr = null;
        }
        return xhr;
      }
  
      // Helper method to parse the title tag from the response.
      function getTitle(text) {
        return text;
      }
  
      // Make the actual CORS request.
      function makeCorsRequest() {
        // All HTML5 Rocks properties support CORS.
        var url = 'http://localhost:8080/myapp/myfunction';
        var xhr = createCORSRequest('POST', url);
        xhr.setRequestHeader(
            'X-Custom-Header', 'value');
        xhr.send();
      }
  </code></pre>
  
  <p><strong>Web service server (java)</strong></p>
  
  <pre><code>@Path("/myapp/")
  @Consumes(MediaType.APPLICATION_JSON)
  @Produces(MediaType.APPLICATION_JSON)
  public class myFunctionClass {
  
  
      @POST
      @Path("myfunction")
      public Response recommendations(User inf){
          // From the client I also need to send json 
          // like {"name":"john","surname":"smith","name":"marry","surname":"smith"}
          // and if possible I want to put this infformation inside inf object
          List&lt;String&gt; infos = inf.getInformation();
  
           // here I call one of the my methods to get recommendations
           // I remove it for simplicity and just put type of recommendations object 
           // list&lt;Recommendation&gt; recommendations= runFunction(infos);
  
          final StringWriter sw =new StringWriter();
          final ObjectMapper mapper = new ObjectMapper();
          mapper.writeValue(sw, recommendations);
          System.out.println(sw.toString());
          sw.close(); 
  
  
          return Response.ok(sw.toString(), MediaType.APPLICATION_JSON).header("Access-Control-Allow-Origin", "*")
                  .header("Access-Control-Allow-Methods", "POST").allow("OPTIONS").build();
  
  
      }
  }
  </code></pre>
  
  <p>However, I think I need to do something more because when I run these, I got </p>
  
  <pre><code>    XMLHttpRequest cannot load      http://localhost:8080/myapp/myfunction. 
  No 'Access-Control-Allow-Origin' header is present on the requested resource. 
  Origin 'http://localhost:3000' is therefore not allowed access.
  </code></pre>
  
  <p>So what should I add to my server code to get rid of this error? Besides, how could I send json data inside my request in client? This is my first time dealing with such issues therefore, If my question a bit absurd, sorry about that.</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>When I remove </p>
  
  <pre><code> xhr.setRequestHeader(
                'X-Custom-Header', 'value');  
  </code></pre>
  
  <p>part from the client, It works properly. As I said before, this is my first time with web-services and javascript so actually I dont know what does this line of code. Could anyone explain me what happens if it exists or not? </p>
  
  <p><strong>EDIT2</strong></p>
  
  <p>I understood that, I need to put </p>
  
  <pre><code>xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
  </code></pre>
  
  <p>in order to send a json with request.But when I added this, same errors come back. What should I add to server to achive this ? </p>