Grunt Server: Not supporting CORS, gives error

问题

I have a server setup and everything was going fine but I am getting errors about

   ....  is not allowed by Access-Control-Allow-Origin

This is very strange as both the grunt server that hosts my Angular.js site is on port 9000 and my rest service is on port 8678.

Anyway I found this

  https://gist.github.com/Vp3n/5340891

which explains how to enable CORS on the grunt server but my grunt file doesn't look the same... this is my current part of my grunt file

  connect: {
      options: {
        port: 9000,
        // Change this to '0.0.0.0' to access the server from outside.
        hostname: 'localhost'
      },
      livereload: {
        options: {
          middleware: function (connect) {
            return [
              lrSnippet,
              mountFolder(connect, '.tmp'),
              mountFolder(connect, yeomanConfig.app)
            ];
          }
        }
      },
      test: {

回答1:

I'm not sure what you mean by "my grunt file doesn't look the same", but you need to read the documentation of grunt-contrib-connect documentation which tells you that the middleware option accepts a function which should return an array of middlewares.

The referred gist is a simple middleware which allows CORS.

In your case it would look like:

connect: {
  options: {
    port: 9000,
    // Change this to '0.0.0.0' to access the server from outside.
    hostname: 'localhost'
  },
  livereload: {
    options: {
      middleware: function (connect) {
        return [
          lrSnippet,
          mountFolder(connect, '.tmp'),
          mountFolder(connect, yeomanConfig.app),
          function(req, res, next) {
            res.setHeader('Access-Control-Allow-Origin', '*');
            res.setHeader('Access-Control-Allow-Methods', '*');
            next();
          }
        ];
      }
    }
  },
  test: {

回答2:

I am facing the same problem and cannot make the Grunt to behave correctly. Here is the corresponding fragment from Gruntfile.js:

connect: {
  options: {
    port: 9000,
    // Change this to '0.0.0.0' to access the server from outside.
    hostname: '0.0.0.0',
    livereload: 35729
  },
  livereload: {
    options: {
      open: true,
      base: [
        '.tmp',
        '<%= yeoman.app %>'
      ]
    }
  },

What would be the right way to updated it with middleware to set Access-Control-Allow-... Headers to *?

来源：https://stackoverflow.com/questions/17239776/grunt-server-not-supporting-cors-gives-error