Express.js CORSミドルウェア設定
Express.jsでcors npmパッケージを設定する完全ガイド。オリジン許可リスト、動的オリジン、認証情報、プリフライト、ルートごとのCORSを解説します。
Framework Config
詳細な説明
Express.js CORSとcorsパッケージ
cors npmパッケージはExpressでCORSを処理する標準的な方法です。オリジンの検証、ヘッダーの設定、OPTIONSの処理の複雑さをクリーンなミドルウェアAPIにまとめています。
インストール
npm install cors
基本的な使用法 — 全オリジン許可
const cors = require("cors");
app.use(cors()); // Access-Control-Allow-Origin: * と同等
本番環境セットアップ — 特定オリジン
const corsOptions = {
origin: ["https://app.example.com", "https://admin.example.com"],
methods: ["GET", "POST", "PUT", "DELETE", "OPTIONS"],
allowedHeaders: ["Content-Type", "Authorization", "X-Requested-With"],
exposedHeaders: ["X-Request-Id", "X-Total-Count"],
credentials: true,
maxAge: 3600,
};
app.use(cors(corsOptions));
動的オリジン検証
const corsOptions = {
origin: (origin, callback) => {
if (!origin) return callback(null, true);
const allowed = /^https:\/\/.*\.example\.com$/.test(origin);
if (allowed) {
callback(null, true);
} else {
callback(new Error("Not allowed by CORS"));
}
},
credentials: true,
};
ルートごとのCORS
// パブリックエンドポイント — 完全オープン
app.get("/api/public", cors(), handler);
// プライベートエンドポイント — 制限付き
app.put("/api/private", cors(corsOptions), handler);
ミドルウェアの順序
CORSミドルウェアは認証やレート制限ミドルウェアの前に配置する必要があります。そうしないと、プリフライトOPTIONSリクエストがCORSヘッダー設定前に拒否されます:
app.use(cors(corsOptions)); // 1. CORS最初
app.use(rateLimiter); // 2. レート制限
app.use(authMiddleware); // 3. 認証
app.use("/api", apiRouter); // 4. ルート
ユースケース
Node.jsバックエンド開発者が、別のドメインでホストされるReactフロントエンドから消費される新しいExpress APIをセットアップしています。最初のデプロイ前にCORSを正しく設定する必要があります。