title: how to upload file to jersey from angularjs and CORS support
body: <p>i'm trying to create upload file service. so i was following <a href="https://examples.javacodegeeks.com/enterprise-java/rest/jersey/jersey-file-upload-example/" rel="nofollow noreferrer">the guide  here</a> for server side .
  and <a href="http://www.angulartutorial.net/2015/03/file-upload-and-sending-data-to-backend.html" rel="nofollow noreferrer">the guide  here</a> for the client side.</p>
  
  <p>but i get that error on the browser</p>
  
  <pre><code>XMLHttpRequest cannot load http://192.168.200.151:8080/documents/uploadDoc. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8383' is therefore not allowed access.
  </code></pre>
  
  <p>and this error on the server<br>
  <code>192.168.200.151 - - [03/Nov/2016:13:44:59 +0000] "OPTIONS /documents/uploadDoc HTTP/1.1" 200 13 "http://localhost:8383/mamagoose/admin/index.html" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.71 Safari/537.36" 3</code>
  .</p>
  
  <p>i know i have issue of CORS support but i have no idea how to overcome it.
  i try to edit my pom.xml with this dependency but no luck.</p>
  
  <p>it must be something i'm missing anyone have idea?</p>
  
  <pre><code>&lt;!-- https://mvnrepository.com/artifact/com.thetransactioncompany/cors-filter --&gt;
  &lt;dependency&gt;
      &lt;groupId&gt;com.thetransactioncompany&lt;/groupId&gt;
      &lt;artifactId&gt;cors-filter&lt;/artifactId&gt;
      &lt;version&gt;2.5&lt;/version&gt;
  &lt;/dependency&gt;
  </code></pre>
  
  <p><strong>client side</strong></p>
  
  <pre><code>  uploadfile : function(action, files, success, error){
  
          var url = webServiceModuleAddress+"/uploadDoc";
  
          for ( var i = 0; i &lt; files.length; i++)
          {
              var fd = new FormData();
              fd.append("file", files[i]);
  
              $http.post(url, fd, {
  
                  withCredentials : false,
  
                  headers : {
                      'Content-Type' : undefined
                      },
                      transformRequest : angular.identity
                     })
                     .success(function(data)
                     {
                      console.log(data);
                     })
                     .error(function(data)
                     {
                      console.log(data);
                     });
         }
      },
  </code></pre>
  
  <p><strong>server side</strong></p>
  
  <pre><code>@POST
  @Path("/uploadDoc")
  @Consumes(MediaType.MULTIPART_FORM_DATA)
  public String uploadFile(@Context HttpServletRequest req, @QueryParam("callback") String callback,@FormDataParam("file") InputStream fileInputStream,@FormDataParam("file") FormDataContentDisposition contentDispositionHeader) throws JsonProcessingException 
  {
      try{
          if(SessionManager.isUserConnected(req))
          {
              String filePath = SERVER_UPLOAD_LOCATION_FOLDER + contentDispositionHeader.getFileName();
              // save the file to the server
              documentsDao.saveFile(fileInputStream, filePath);
              String output = "File saved to server location : " + filePath;
              return ResourceResponse.getResourceJsonString(output, callback, "true", ErrorMessageEnum.SUCCESS);
          }
          else
          {
              return ResourceResponse.getResourceFailResponseString(callback, ErrorMessageEnum.USER_NOT_CONNECTED);
          }
  
      }catch(Exception e)
      {
          e.printStackTrace();
          return ResourceResponse.getResourceFailResponseString(callback, ErrorMessageEnum.FAILURE);
  
      }
  }
  </code></pre>