javascript - Setting default response headers in Express

I'm working on a small app running on the MEAN stack, and have hit an annoying snag: My backend app (Node with Express) is running at http://localhost:3000 and working just fine, but my frontend client app (Javascript with AngularJS) is running at http://localhost:8000, which means requests sent from Angular are received and responded to, but are rejected once they arrive because they're interpreted as ing from a different origin.

I was able to fix this with relatively little drama, by making my 'show me all the stuff' method look something like this:

exports.index = function(req, res) {
  Region.find({}, function(err, docs) {
    if(!err) {
      res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000');
      res.json(200, { regions: docs });
    } else {
      res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000');
      res.json(500, { message: err });
    }
  });
}

The res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000'); line is the one that I added to tell the browser it was fine to accept the response and stop bothering me about it; the problem now is that I have to add this stupid line to every single response that's sent from anywhere, and I'm convinced I must be missing some way to just change the default headers to include the Access-Control-Allow-Origin entry forever.

In a perfect world, I'd be able to flip this on and off based on what environment the code was being executed in, but I'd totally settle for a code block in app.js that I could at least remove one time instead of trying to track down 75 instances of res.setHeader. I figure there must be a way to change the .json method hiding behind res at its base, but the docs don't offer any insight into how I might do that, not to mention whether it's a terrible idea. Any thoughts?

edit

I thought (as was suggested) that configuring application-level middleware was the key. Here's the code that I added to my app.js file:

// allow CORS:
app.use(function (req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000');
  next();
});

This, however, yielded the same error ("No 'Access-Control-Allow-Origin' header is present on the requested resource.") as before.

I was able to fix this with relatively little drama, by making my 'show me all the stuff' method look something like this:

exports.index = function(req, res) {
  Region.find({}, function(err, docs) {
    if(!err) {
      res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000');
      res.json(200, { regions: docs });
    } else {
      res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000');
      res.json(500, { message: err });
    }
  });
}

edit

I thought (as was suggested) that configuring application-level middleware was the key. Here's the code that I added to my app.js file:

// allow CORS:
app.use(function (req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000');
  next();
});

This, however, yielded the same error ("No 'Access-Control-Allow-Origin' header is present on the requested resource.") as before.

Share Improve this question edited Sep 3, 2015 at 2:57 asked Sep 3, 2015 at 2:16 rabdill 4671 gold badge7 silver badges11 bronze badges

1 This is what app.use() is for to install a middleware handler that gets to see/modify all requests. – jfriend00 Commented Sep 3, 2015 at 2:37
I have a feeling that I'm close, but the middleware I'm registering doesn't seem to be doing anything (see the edit to my question); I added some debugging output to see when it was being executed, but it never popped up in the console. I was optimistic about the "setHeaders" option in the built-in middleware, but it's only for the static resources and I can't find a corresponding third-party one that handles... everything else. – rabdill Commented Sep 3, 2015 at 3:11
1 It looks like you might also have to set Access-Control-Allow-Headers. See jonathanmh./how-to-enable-cors-in-express-js-node-js – jfriend00 Commented Sep 3, 2015 at 3:40
1 Try the npm module npmjs./package/cors it's pretty solid – jusynth Commented Sep 3, 2015 at 3:46
@jfriend00: If I use the original, repetitive way of setting the headers, it works with or without Access-Control-Allow-Headers. @jusynth: The "cors" packaged WORKED! At first, it failed like the other half-dozen packages I've tried, but moving app.use(cors()); from the bottom of the list of app.use(foo) entries to the top of the list fixed it all. No idea why. Thanks so much. – rabdill Commented Sep 3, 2015 at 3:53

Add a ment |

3 Answers 3

Sorted by: Reset to default 9

Try this one as a middleware:

app.use(function(req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'GET, POST');
  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type, Authorization');
  next();
});

I just ran into the same issue and tried the same snippet above. It did the trick.

// allow CORS:
app.use(function (req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8000')
  next()
})

IMPORTANT: I had to place it above all other app.use(xyz) entries, just like @rev_bird mentioned he did with the CORS module. Try it.

you can make a mon middleware using .use() or can use npm packages like express-interceptor also to intercept the response

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - Setting default response headers in Express - Stack Overflow

3 Answers 3

评论列表(0)