title: how do you set up CORS with Angular JS
body: <p>How do I set up Angular to send the correct headers when making Cross Domain Ajax Requests?</p>
  
  <p>What worked for me:</p>
  
  <p>After about a full day of trying to find an answer to configuring my Angular application to work with CORS, I finally came up with a solution that works! Assuming you have set up the server correctly - the only thing you need to do on the client is delete the default header in your app config.</p>
  
  <pre><code>angular.module('myApp').config(['$httpProvider', function($httpProvider) {
  
      delete $httpProvider.defaults.headers.common['X-Requested-With'];
  
  });
  </code></pre>
  
  <p>The X-Requested-With header identifies the request as an AJAX request - and by default cross domain is not allowed. So all we need to do is remove it from our default settings and BOOM! It works. </p>
  
  <p>For our application we are using a play backend(1.2.5) - The line of code we needed to add to make that work was:</p>
  
  <p>Add headers to allow cross-domain requests. Be careful, a lot of browsers don't support these features and will ignore the headers. Refer to the browsers' documentation to know what versions support them.</p>
  
  <p>Parameters:
  allowOrigin a comma separated list of domains allowed to perform the x-domain call, or "<em>" for all.
  allowMethods a comma separated list of HTTP methods allowed, or null for all.
  allowCredentials Let the browser send the cookies when doing a x-domain request. Only respected by the browser if allowOrigin != "</em>"</p>
  
  <pre><code>Http.Response.current().accessControl("*", "GET,PUT,POST,DELETE,OPTIONS",false);
  </code></pre>