web-dev-qa-db-ja.com

node.jsのexpress.jsフレームワークでクロスオリジンリソース共有（CORS）を有効にする方法

パブリックディレクトリから静的ファイルを提供しながら、クロスドメインスクリプトをサポートするnode.jsでWebサーバーを構築しようとしています。 express.jsを使用していますが、クロスドメインスクリプト（Access-Control-Allow-Origin: *）を許可する方法がわかりません。

この投稿 を見ましたが、これは役に立ちませんでした。

var express = require('express')
  , app = express.createServer();

app.get('/', function (req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    next();
});

app.configure(function () {
    app.use(express.methodOverride());
    app.use(express.bodyParser());
    app.use(app.router);
});

app.configure('development', function () {

    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});

app.configure('production', function () {


    var oneYear = 31557600000;
    //    app.use(express.static(__dirname + '/public', { maxAge: oneYear }));
    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler());
});

app.listen(8888);
console.log('express running at http://localhost:%d', 8888);
node.jsexpresscorswebservercross-domain
94
Guy

enable-cors.orgの例 をご覧ください。

Node.jsのExpressJSアプリで、ルートを使用して以下を実行します。

app.all('/', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
 });

app.get('/', function(req, res, next) {
  // Handle the get for this route
});

app.post('/', function(req, res, next) {
 // Handle the post for this route
});

最初の呼び出し（app.all）は、アプリ内の他のすべてのルート（または少なくともCORSを有効にするルート）の前に行う必要があります。

[編集]

静的ファイルにもヘッダーを表示したい場合は、これを試してください（use(express.static())への呼び出しの前にあることを確認してください：

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
});

あなたのコードでこれをテストし、publicディレクトリからアセットのヘッダーを取得しました：

var express = require('express')
  , app = express.createServer();

app.configure(function () {
    app.use(express.methodOverride());
    app.use(express.bodyParser());
    app.use(function(req, res, next) {
      res.header("Access-Control-Allow-Origin", "*");
      res.header("Access-Control-Allow-Headers", "X-Requested-With");
      next();
    });
    app.use(app.router);
});

app.configure('development', function () {
    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});

app.configure('production', function () {
    app.use(express.static(__dirname + '/public'));
    app.use(express.errorHandler());
});

app.listen(8888);
console.log('express running at http://localhost:%d', 8888);

もちろん、関数をモジュールにパッケージ化して、次のようなことができます

// cors.js

module.exports = function() {
  return function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    next();
  };
}

// server.js

cors = require('./cors');
app.use(cors());
156
Michelle Tilley

@Michelle Tilleyソリューションに続いて、どうやら最初はうまくいかなかったようです。理由はわかりませんが、chromeと異なるバージョンのノードを使用している可能性があります。いくつかのマイナーな調整を行った後、それは今私のために働いています。

app.all('*', function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  next();
});

誰かが私のものと同様の問題に直面している場合、これは役に立つかもしれません。

55
TonyTakeshi

これを試してください cors npm modules。

var cors = require('cors')

var app = express()
app.use(cors())

このモジュールは、ドメインのホワイトリスト登録、特定のAPIなどのcorsの有効化など、cors設定を微調整するための多くの機能を提供します。

11
Zahid Rahman

私はこれを使用します：

var app = express();

app
.use(function(req, res, next){
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'X-Requested-With');
    next();
})
.options('*', function(req, res, next){
    res.end();
})
;

h.readFiles('controllers').forEach(function(file){
  require('./controllers/' + file)(app);
})
;

app.listen(port);
console.log('server listening on port ' + port);

このコードは、コントローラーがコントローラーディレクトリにあることを前提としています。このディレクトリ内の各ファイルは次のようになります。

module.exports = function(app){

    app.get('/', function(req, res, next){
        res.end('hi');
    });

}
2
Elmer

cors expressモジュールの使用を推奨します。これにより、ドメインをホワイトリストに登録したり、ドメインを特にルートに許可/制限したりできます。

1
Jerome Anthony

「資格情報」を介して「Cookie」を使用する場合は、Access-Control-Allow-Credentials: trueを設定する必要があります

app.all('*', function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Credentials', true);
  res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  next();
});
0
dukegod