title: Allow CORS REST request to an express/node.js app
body: <p>I am new to node.js/express.  I saw this post ( <a href="https://stackoverflow.com/questions/11001817/allow-cors-rest-request-to-a-express-node-js-application-on-heroku">Allow CORS REST request to a Express/Node.js application on Heroku</a>), but the proposed solution did not work.</p>
  
  <p>I am just making a call to mapquest api to get some data to play around with.</p>
  
  <p>Here is part of my server.js:</p>
  
  <pre><code>var allowCrossDomain = function(req, res, next) {
      res.header('Access-Control-Allow-Origin', '*');
      res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
      res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
  
      // intercept OPTIONS method
      if ('OPTIONS' == req.method) {
        console.log('hit options');
        res.send(200);
      }
      else {
        next();
      }
  };
  
  app.configure(function(){
    console.log('configuring app');
    app.use(allowCrossDomain);
    app.use(express.bodyParser());
    app.use(express.methodOverride());
    app.use(app.router);
    app.use(express.static(__dirname + '/public')); 
    //app.use(express.static(path.join(application_root, "public")));
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
  });
  
  /**
   * Main route
   */
  
  app.get('/', function (req, res, next) {
    console.log("getting /");
    Project.findAll()
      .success(function (projects) {
        res.render('index', { projects: projects });
      })
      .error(next);
  });
  </code></pre>
  
  <p>And here is part of my client-side main.js:</p>
  
  <pre><code>  $('#spec').click(function(ev){
      var form = $(this);
      $.ajax({
          url: "http://www.mapquestapi.com/geocoding/v1/address?key=&lt;mykey&gt;"
        , type: 'POST'
        , datatype: 'json'
        , contentType: 'json'
        , data: { 
              location : {
              "postalCode":"99999"
              }
            , options : { thumbMaps : false} 
          }
        , success: function(resp){
            $('#mapdata').html(resp);
          }
        , error : function(resp){
            $('#mapdata').html(resp);
          }
      });
    });
  </code></pre>
  
  <p>Here are my request headers in chrome dev window:</p>
  
  <pre><code>Accept:*/*
  Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
  Accept-Encoding:gzip,deflate,sdch
  Accept-Language:en-US,en;q=0.8
  Access-Control-Request-Headers:accept, origin, content-type
  Access-Control-Request-Method:POST
  Connection:keep-alive
  Host:www.mapquestapi.com
  Origin:http://localhost:3000
  Referer:http://localhost:3000/
  User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.43 Safari/537.31
  </code></pre>
  
  <p>And here are response headers:</p>
  
  <blockquote>
    <p>Allow:TRACE, OPTIONS Content-Length:0 Date:Sun, 07 Apr 2013 03:18:48
    GMT Server:Apache-Coyote/1.1</p>
  </blockquote>
  
  <p>And here is the error message:</p>
  
  <pre><code>Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin. 
  </code></pre>