CORS

CORS（Cross-Origin Resource Sharing）とは

CORS（クロスオリジンリソースシェアリング）は、異なるドメイン間でのHTTP通信を安全に行うためのセキュリティ機構です。ブラウザのセキュリティポリシーである同一オリジンポリシーにより、デフォルトではJavaScriptから別ドメインへのアクセスが制限されています。CORSは、サーバー側で適切なヘッダーを返すことで、この制限を解除し、安全にリソースを共有する仕組みです。

フリーランスエンジニアがAPI開発やフロントエンド開発を行う際、クライアント側とAPI側で異なるドメインを使用する場面は多くあります。例えば、localhost:3000で開発しているReactアプリケーションから、localhost:5000で動作するバックエンドAPIにアクセスする場合、CORSの設定が必要になります。

CORSエラーが発生する原因と対処法

CORSエラーが発生するのは、サーバー側が`Access-Control-Allow-Origin`ヘッダーを返していない場合です。Node.jsのExpressで開発している場合、corsミドルウェアを導入するだけで簡単に対応できます。

“`javascript
const cors = require(‘cors’);
app.use(cors());
“`

より細かく制御したい場合は、許可するオリジンを指定することができます。本番環境では、すべてのオリジンを許可する設定は避け、信頼できるドメインのみを許可する設定が重要です。

まとめ

CORSはクロスオリジン通信を安全に実現するための標準仕様であり、モダンなWeb開発では避けて通れない知識です。