title: No 'Access-Control-Allow-Origin' header with ExpressJS to local server
body: <p>I know that this subject seems to be already answered many time but i really don't understand it.</p>
  
  <ul>
  <li>I have an local angular-fullstack app (Express, NodeJs) which has his
  <strong>server A</strong> (<em>localhost:9000/</em>).</li>
  <li>i have an another local <strong>front app B</strong> (BlurAdmin done with
  generator-gulp-angular) (<em>localhost:3000/</em>)</li>
  </ul>
  
  <p>My server A was autogenerate with Express and Nodejs:</p>
  
  <pre><code>  app.use(function (req, res, next) {
  
      res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000');
      res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
      res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
      res.setHeader('Access-Control-Allow-Credentials', false);
      next();
  });
  </code></pre>
  
  <p>In my app B, a GET request to my API of serveur A works </p>
  
  <pre><code>$http.get('http://localhost:9000/api/shows')
  </code></pre>
  
  <p>But with a PUT request:</p>
  
  <pre><code>$http.put('http://localhost:9000/api/shows/1', object)
  </code></pre>
  
  <p>i have the following error:</p>
  
  <blockquote>
    <p>XMLHttpRequest cannot load <a href="http://localhost:9000/api/shows/1" rel="nofollow">http://localhost:9000/api/shows/1</a>. No
    'Access-Control-Allow-Origin' header is present on the requested
    resource. Origin '<a href="http://localhost:3000" rel="nofollow">http://localhost:3000</a>' is therefore not allowed
    access. The response had HTTP status code 403.</p>
  </blockquote>
  
  <p>I try with:</p>
  
  <pre><code>  $http({
      method: "PUT",
      url:'http://localhost:9000/api/shows/1',
      headers: {
        'Content-type': 'application/json'
      },
      data:object
    });
  </code></pre>
  
  <p>Not working,</p>
  
  <p>I try with:</p>
  
  <pre><code>res.header('Access-Control-Allow-Origin', '*');
  </code></pre>
  
  <p>Not working,</p>
  
  <p>I have installed *ExtensionAllow-Control-Allow-Origin: ** for chrome and that has done nothing (that return just not all the code but only error 403 (forbidden)</p>
  
  <p>I don't really know why this is not working for PUT when it's working with GET.</p>
  
  <p>Have you already had this problem? Thanks!</p>
  
  <p><strong>Updated:1</strong> The result in my Browser:
  <strong>for GET</strong> </p>
  
  <pre><code>General:
  Request URL:http://localhost:9000/api/shows/1
  Request Method:OPTIONS
  Status Code:200 OK
  
  Request header:
  Accept:*/*
  Accept-Encoding:gzip, deflate, sdch
  Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4,de-DE;q=0.2,de;q=0.2
  Access-Control-Request-Headers:content-type
  Access-Control-Request-Method:PUT
  Connection:keep-alive
  Host:localhost:9000
  Origin:http://localhost:3000
  Referer:http://localhost:3000/
  
  Response header: 
  Access-Control-Allow-Credentials:true
  Access-Control-Allow-Headers:X-Requested-With,content-type
  Access-Control-Allow-Methods:GET, POST, OPTIONS, PUT, PATCH, DELETE
  Access-Control-Allow-Origin:http://localhost:3000
  Allow:GET,HEAD,PUT,PATCH,DELETE
  Connection:keep-alive
  Content-Length:25
  Content-Type:text/html; charset=utf-8
  </code></pre>
  
  <p><strong>For PUT</strong> request:</p>
  
  <pre><code>general:
  Request URL:http://localhost:9000/api/shows/1
  Request Method:PUT
  Status Code:403 Forbidden
  
  Response Header:
  Connection:keep-alive
  Content-Encoding:gzip
  Content-Type:application/json; charset=utf-8
  Date:Thu, 25 Aug 2016 16:29:44 GMT
  set-cookie:connect.sid=s%3AsVwxxbO-rwLH-1IBZdFzZK1xTStkDUdw.xuvw41CVkFCRK2lHNlowAP9vYMUwoRfHtc4KiLqwlJk; Path=/; HttpOnly
  set-cookie:XSRF-TOKEN=toaMLibU5zWu2CK19Dfi5W0k4k%2Fz7PYY%2B9Yeo%3D; Path=/
  Strict-Transport-Security:max-age=31536000; includeSubDomains; preload
  
  Request header:
  Accept:application/json, text/plain, */*
  Accept-Encoding:gzip, deflate, sdch
  Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4,de-DE;q=0.2,de;q=0.2
  Connection:keep-alive
  Content-Length:27
  Content-Type:application/json
  Host:localhost:9000
  Origin:http://localhost:3000
  Referer:http://localhost:3000/
  
  Request Payload:
  {url_name: "myData"}
  url_name
  :
  "myData"
  </code></pre>
  
  <p>Thanks for helping</p>
  
  <p><strong>Update 2:</strong> with <em><a href="https://github.com/troygoode/node-cors-server/blob/master/app.js" rel="nofollow">https://github.com/troygoode/node-cors-server/blob/master/app.js</a></em> and the work of @Chris Foster
  I have install <code>npm cors --save</code>
  in my app.js, 
  i have now the following code:</p>
  
  <pre><code>import express from 'express'; 
  import cors from 'cors'; 
  
  var app = express()
  
  var corsOptions = {
    origin: 'http://localhost:3000'
  }
  var issuesoption = {
    origin: true,
    methods: ['PUT'],
    credentials: true,
  };
  
  
  app.use(cors(corsOptions))
  app.options('*', cors(issuesoption));
  app.put('/api/shows/:id',cors(issuesoption) ,function(req,res){
    res.json({
      data: 'Issue #2 is fixed.'
    });
  });
  </code></pre>
  
  <p>And that is still not working with:</p>
  
  <pre><code>$http.put("http://localhost:9000/api/shows/1",object)
  </code></pre>
  
  <p><strong>BUT</strong> i don't have any 403 error, I have now,</p>
  
  <pre><code>Request URL:http://localhost:9000/api/shows/1
  Request Method:PUT
  Status Code:200 OK
  </code></pre>
  
  <p><strong>But</strong> that doesn't put the data into the server and i have in Preview:</p>
  
  <pre><code>{data: "Issue #2 is fixed."}
  </code></pre>