web-dev-qa-db-ja.com

エクスプレスサーバーでCORS要求を受け入れるようにする

エクスプレスサーバーを http：// localhost：30 で実行しています（このWebサーバーと呼びます）localhost：8100で別のアプリケーションを実行しています（これを単に「アプリ」と呼びます）

アプリがウェブサーバーに電話をかけると、次のメッセージが表示されます。

"XMLHTTPReqeust cannot load http://localhost:3000/auth/facebook. Response to preflight request doesn't pass access control check. A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' when the credentials flag is true. Origin 'http://localhost:81000' is therefore not allowed acecss"

このメッセージは、ブラウザコンソールに表示されます。

ノードWebサーバーのミドルウェアに次のオプションを設定しました

res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET,PUT, POST,DELETE');

Stackoverfowに関するいくつかの質問を読んだ後、次の項目も追加しました。

 res.header('Access-Control-Allow-Origin', 'http://localhost:8100');

ただし、これで問題は解決しません。

node.jsexpresscors
18
runtimeZero

個人的には cors モジュールを好みます。コードは本当に簡単です：

var whitelist = [
    'http://0.0.0.0:3000',
];
var corsOptions = {
    Origin: function(Origin, callback){
        var originIsWhitelisted = whitelist.indexOf(Origin) !== -1;
        callback(null, originIsWhitelisted);
    },
    credentials: true
};
app.use(cors(corsOptions));
17
Thomas Bormans

私はCORを使用して実装しているので、非常に簡単です

var cors=require('cors');

app.use(cors({Origin:true,credentials: true}));

16
juan david restrepo villada

また、ヘッダーでOPTIONSメソッドを許可する必要があります。

私はCOR用のこのミドルウェアを持っています：

module.exports = function (req, res, next) {
    // CORS headers
    res.header("Access-Control-Allow-Origin", "YOUR_URL"); // restrict it to the required domain
    res.header("Access-Control-Allow-Methods", "GET,PUT,POST,DELETE,OPTIONS");
    // Set custom headers for CORS
    res.header("Access-Control-Allow-Headers", "Content-type,Accept,X-Custom-Header");

    if (req.method === "OPTIONS") {
        return res.status(200).end();
    }

    return next();
};

PS。表示されるエラーは、クロスオリジンリクエストがどのように機能するかによるものです。簡単に言うと、ブラウザは最初にメソッドOPTIONSでpre-flightリクエストを送信し、許可されたオリジン、ヘッダー、メソッドを取得します。そのため、このリクエストではAccess-Control-*ヘッダーのみを返す必要があります。 pre-flightがうまくいった場合、ブラウザは元のリクエストを続行します。

より多くの情報を見つけることができます こちら 。

15
Vsevolod Goloviznin

どうやらcorsモジュールは動作しませんでした。

上記のヒントを使用して、次のコードを使用しました。

  if (req.method === "OPTIONS") {
    res.header('Access-Control-Allow-Origin', req.headers.Origin);
  } else {
    res.header('Access-Control-Allow-Origin', '*');
  }

これでうまくいきました。

7
runtimeZero

同じ問題が発生し、1時間ほどつまずきましたが、実際の解決策はシンプルで、CORSを有効にして プリフライト操作

app.options('*', cors()); // include before other routes
7
Louie Almeda

私は以前にこれをクラックしたと思っていましたが、一度IISからIIS Expressに切り替えて、再びエラーを取得し始めました!!

再びGoogleを開始し、上記を含む多数の提案を試みましたが、 Melvin's Web Stuff-Enable CORS IIS Express which以下を提案しました：

<customHeaders>セクションの下の<httpProtocol>セクションに次の2行を追加します。

<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />

次の場所にあるapplicationhost.configに移動します。

%HOMEPATH%\Documents\IISExpress\config

最終結果は次のようになります。

<httpProtocol>
   <customHeaders>
      <clear />
         <add name="X-Powered-By" value="ASP.NET" />
         <add name="Access-Control-Allow-Origin" value="*" />
         <add name="Access-Control-Allow-Headers" value="Content-Type" />   
   </customHeaders>
   <redirectHeaders>
      <clear />
   </redirectHeaders>
</httpProtocol>

これはうまく機能しましたが、IISで実行する場合は上記の必要はないことに注意してください。

0
Thierry