title: AngularJS CORS issue in Chrome - No 'Access-Control-Allow-Origin' header is present on the requested resource
body: <p>I'm doing a little exercise to familiarise myself with AngularJS and I have my app running on <code>http://127.0.0.1:9000/</code> after I execute the necessary grunt task. Now I wish to write/teach myself how to allow a Authorization/Authentication request (basically a login form). I have a seperate project that has a REST API, this is running on <code>http://127.0.0.1:3000/</code> - notice the difference in port numbers. The exercise is hosted on my local machine so I wish to use CORS for my requests as browser restrictions aren't an issue and the app is for my own amusement. In my angularJS app I have included the following code in my <code>config</code> to allow CORS requests:</p>
  
  <pre><code>// set up CORS...
  $httpProvider.defaults.useXDomain = true;
  delete $httpProvider.defaults.headers.common['X-Requested-With'];
  </code></pre>
  
  <p>In my Rest API / Node Project I include the CORS middleware available from <a href="https://www.npmjs.org/package/cors" rel="nofollow">https://www.npmjs.org/package/cors</a> and I have enabled CORS for all requests, I have included the library like so:</p>
  
  <pre><code>cors = require('cors')
  </code></pre>
  
  <p>and then...</p>
  
  <pre><code>app.use(cors()); // this is in my app.configure
  </code></pre>
  
  <p>When I test the API using the Websore REST tool the data I desire is retured however when trying to access this is my AngularJS app the Chrome JavaScript console gives me the following error: </p>
  
  <pre><code>No 'Access-Control-Allow-Origin' header is present on the requested resource
  </code></pre>
  
  <p>Is there anything I have missed with setting up CORS for AngularJS? Thanks in advance.</p>