- そもそもCORSとは？
- Django REST FrameworkでCORS設定をするには？
本記事ではこのような疑問を解決します。
AngularやReact、Vueなどのフレームワークを用いたWebアプリケーション開発においては、APIによってサーバーサイドとやりとりをする仕様がほとんどでしょう。
このようなフロントエンドとバックエンドを切り離したWebアプリケーション開発（今流行りのSPA開発）ではCORS設定が問題になってきます。
また、バックエンドをDjango REST Frameworkで構築する場合のCORS設定はどのようにすればいいのでしょうか？
そこで今回はDjango REST FrameworkでCORS設定をする方法を解説していきます。
エンジニアが副業を始めるには？エンジニアの副業にはどんな種類がある？ 本記事ではこのような疑問を解決します。副業がブームになっている昨今、エンジニアほど副業をやりやすい職業はないでしょう。副業に関心があったり、副業をしてみたいと思っ[…]
そもそもCORSとは？
CORSとは「Cross-Origin Resource Sharing」の略で、オリジン間リソース共有のことです。
簡単にいうと、ある場所で動作しているWebアプリケーションから別の場所にあるWebアプリケーションへのアクセスを許可する仕組みになります。
ちなみに、オリジンとは「プロトコル + ホスト（ドメイン） + ポート」で構成された、Webアプリケーションが動作している場所を表します。
つまり、ポートまですべて一緒でないと別のオリジンとして認識されてしまうということです。
なぜCORSという仕組みがあるのかというと、セキュリティの観点から、リクエストを許可したオリジンからのみに制限するためです。
例えば、YouTubeやTwitterなどがさまざまなAPIを提供していますが、APIを利用するには申請・許可が必要になります。
CORS設定が必要になってくるのは、フロントエンドとバックエンドを切り離してAPI連携をするWebアプリケーション開発での場合がほとんどでしょう。
そして、今回はサーバーサイドをDjango REST Frameworkで構築する場合のCORS設定を見ていきます。
フリーランスエンジニアが案件獲得方法とは？自ら営業せずに案件を獲得するには？実務経験1年未満でも大丈夫なの？ 本記事ではこのような疑問を解決します。これからフリーランスエンジニアとして独立したい方は、兎にも角にも案件の獲得が急務です[…]
Django Rest FrameworkでCORS設定をする手順
それでは実際にDjango REST FrameworkでCORS設定をしていきます。
とは言っても簡単な作業で5分もかからないので安心してください。
django-cors-headersをインストールする
まずはDjangoにCORSを導入するためにdjango-cors-headersをインストールします。
$ pip install django-cors-headers
settins.pyを編集する
ここではsettins.pyにて各種変数の中にdjango-cors-headersに関する値を追加していきます。
# INSTALLED_APPS内に’corsheaders’を追加する
INSTALLED_APPS = [
・・・
'corsheaders',
]
# MIDDLEWARE内に’corsheaders.middleware.CorsMiddleware’を追加する
MIDDLEWARE = [
・・・
'corsheaders.middleware.CorsMiddleware',
]
# 新たにCORS_ORIGIN_WHITELIST変数を記述して、その中にアクセスを許可したいURL（アクセス元）を追加する
CORS_ORIGIN_WHITELIST = [
'http://127.0.0.1:3000'
]これでDjango REST FrameworkにおけるCORS設定が完了しました。
実際にAPIを叩いてみるとレスポンスを受け取ることができると思います。
まとめ
以上がDjango REST FrameworkでCORS設定をする方法になります。
フロントのフレームワーク（AngularやReact、Vueなど）とDjango（Django REST Frameworkも）の組み合わせの場合は本記事でご紹介した設定がほぼ必須になってきます。
その際はぜひ今回の内容をご参考にしてみてください。
実務1年未満でもOK！フリーランスエンジニアの案件獲得方法はこちら！
フリーランスエンジニアが案件獲得方法とは？自ら営業せずに案件を獲得するには？実務経験1年未満でも大丈夫なの？ 本記事ではこのような疑問を解決します。これからフリーランスエンジニアとして独立したい方は、兎にも角にも案件の獲得が急務です[…]
