Question

我正在编写一个提供静态html，css和javascript的小型演示Web服务器。服务器看起来像

(function () {
    "use strict";

    var http = require("http");
    var connect = require('connect');
    var app = connect()
        .use(connect.logger('dev'))
        .use(connect.static('home'));

    var server = http.createServer(app);
    server.listen(9999, function () {
        console.log('server is listening');
    });
})();

我的客户端javascript对另一台服务器进行ajax调用。我该如何添加

Access-Control-Allow-Origin: http://example.com

到我的服务器响应，以便客户端javascript可以进行ajax调用吗？

Answer 1

因为express已经破坏了我，所以在解决这个问题时遇到了一些麻烦。

看看enable cors。基本上您需要做的是将Access-Control-Allow-Origin添加到要启用cors的域中。 response.setHeaders非常适合这项任务。

需要注意的另一件事是connect无法处理路由。如果您的应用需要具有不同的路由，那么您可能必须为每个路由编写逻辑，并将res头添加到您要启用cors的路径。您可以使用req.url。

var http = require("http");
var connect = require('connect');

var app = connect()

    .use(connect.logger('dev'))

    .use(connect.static('home'))

    .use(function(req, res){

    res.setHeader("Access-Control-Allow-Origin", "http://example.com");
    res.end('hello world\n');

 });

var server = http.createServer(app);

server.listen(9999, function () {

    console.log('server is listening');
});

这是我在chrome dev工具中得到的回复

HTTP/1.1 200 OK
Access-Control-Allow-Origin: http://example.com
Date: Sat, 15 Jun 2013 16:01:59 GMT
Connection: keep-alive
Transfer-Encoding: chunked

Answer 2

我希望这会有所帮助：

//CORS middleware
var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', config.allowedDomains);
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Content-Type');

    next();
}

//...
app.configure(function() {

    app.use(allowCrossDomain);
    app.use(express.static(__dirname + '/public'));
});

更多细节： How to allow CORS?

Answer 3

最简单的方法，如果你正在使用gulp将是使用gulp插件名为＆＃34; gulp-connect＆＃34;和＆＃34; connect-modrewrite＆＃34;并定义一个新的gulptask来重定向特定的api。这是为了使apache充当特定api的代理，绕过飞行前请求，以避免CORs问题。我使用以下gulp任务来克服这个问题。

var connect = require('gulp-connect'),
    modRewrite = require('connect-modrewrite');
/**
* Proxy Config
*/
gulp.task('connect', function () {
  connect.server({
    root: ['./.tmp', './.tmp/{folderLocations}', './src', './bower_components'],
    port: 9000,
    livereload: true,
    middleware: function (connect, opt) {
      return [
        modRewrite([
          '^/loginProxy/(.*)$ http://app.xyzdomain.com/service/login/auth/$1 [P]'
        ])
      ];
    }
  });
});

Answer 4

express.static获取配置对象。您可以提供属性setHeaders，您可以从该函数为响应设置标题：

    app.use(express.static('public', {
      setHeaders: function setHeaders(res, path, stat) {
        res.header('Access-Control-Allow-Origin', '*');
        res.header('Access-Control-Allow-Methods', 'GET');
        res.header('Access-Control-Allow-Headers', 'Content-Type');
      }
    }))

此功能的参数是：

res，响应对象。
path，正在发送的文件路径。
stat，正在发送的文件的stat对象。

我希望此处的请求可用，以便我可以根据Origin标头有条件地设置CORS标头。

如何将CORS-Header添加到静态连接服务器？

4 个答案: