質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Django

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

REST

REST(Representational State Transfer)はwebアプリケーションの構築スタイルの一種です。HTTP GET/POSTによってリクエストを送信し、レスポンスはXMLで返されます。SOAPのようなRPCの構築と比べるとサーバからクライアントを分離することが出来る為、人気です。

サーバ

サーバは、 クライアントサーバモデルにおいてクライアントからの要求に対し 何らかのサービスを提供するプログラムを指す言葉です。 また、サーバーソフトウェアを稼動させているコンピュータ機器そのもののことも、 サーバーと呼ぶ場合もあります。

CORS

CORSとはCross-Origin Resource Sharingの頭文字をとったもので、ブラウザがオリジン以外のサーバからデータを取得するシステムのことです。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

Q&A

0回答

2274閲覧

Django-CORS-Headersが動作しません。

Imamuu.is

総合スコア13

Django

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

REST

REST(Representational State Transfer)はwebアプリケーションの構築スタイルの一種です。HTTP GET/POSTによってリクエストを送信し、レスポンスはXMLで返されます。SOAPのようなRPCの構築と比べるとサーバからクライアントを分離することが出来る為、人気です。

サーバ

サーバは、 クライアントサーバモデルにおいてクライアントからの要求に対し 何らかのサービスを提供するプログラムを指す言葉です。 また、サーバーソフトウェアを稼動させているコンピュータ機器そのもののことも、 サーバーと呼ぶ場合もあります。

CORS

CORSとはCross-Origin Resource Sharingの頭文字をとったもので、ブラウザがオリジン以外のサーバからデータを取得するシステムのことです。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

0グッド

1クリップ

投稿2021/07/21 12:15

DjangoのAPIサーバーでPreflightを通過させれるようなヘッダー情報を付加できるようにしたいです。
しかし、Django-cors-headersがうまく動作していないようです。

まず、ローカルの自前DjangoサーバのAPIをChromeブラウザのjsコード経由で読み込もうとすると、

Access to XMLHttpRequest at 'http://127.0.0.1:8000/api/hoge/' from origin 'http://localhost:56957' has been blocked by CORS policy: Request header field token is not allowed by Access-Control-Allow-Headers in preflight response.

となってしまいました。
調べるとDjango側でヘッダーをつけていないためにCROS制約に引っかかているようでしたので、以下のようにDjango-cors-headersをsettings.pyに追加してみました。
しかし、これでもヘッダーにprefrightリクエスト通すために必要な情報が含まれるようにはなりませんでした。

INSTALLED_APPS = [ #Django apps 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'rest_framework', 'corsheaders',#追加 ] MIDDLEWARE = [ 'django.middleware.security.SecurityMiddleware', 'django.contrib.sessions.middleware.SessionMiddleware', 'django.middleware.csrf.CsrfViewMiddleware', 'django.contrib.auth.middleware.AuthenticationMiddleware', 'django.contrib.messages.middleware.MessageMiddleware', 'django.middleware.clickjacking.XFrameOptionsMiddleware', 'corsheaders.middleware.CorsMiddleware',#追加 'django.middleware.common.CommonMiddleware', ] #以下追加 CORS_ALLOW_ALL_ORIGINS = True # If this is used then `CORS_ALLOWED_ORIGINS` will not have any effect CORS_ALLOW_CREDENTIALS = True CORS_ALLOW_METHODS = [ 'DELETE', 'GET', 'OPTIONS', 'PATCH', 'POST', 'PUT', ] CORS_ALLOW_HEADERS = [ 'accept', 'accept-encoding', 'authorization', 'content-type', 'dnt', 'origin', 'user-agent', 'x-csrftoken', 'x-requested-with', 'access-control-allow-origin', ]

以上を追加した後にcurlで取得した情報のヘッダ−

HTTP/1.1 200 OK Date: Wed, 21 Jul 2021 11:55:26 GMT Server: WSGIServer/0.2 CPython/3.8.3 Content-Type: application/json Content-Length: 449 Vary: Origin X-Frame-Options: DENY X-Content-Type-Options: nosniff Referrer-Policy: same-origin

調べた限りだと、上記のような設定で十分なヘッダーを返せるようなつもりでしたが、どうも不十分なようです。

これは、どのように修正すると、preflightを通過させるのに十分なヘッダー情報が反映されるようになるのかもしわかる方がいらっしゃいましたら、ご指導いただけると大変助かります。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

dameo

2021/07/23 23:24

質問文は細かく見ていませんが、 https://blog.tsukumijima.net/article/django-rest-framework-cors/ によると、リクエストにOriginヘッダがない場合はレスポンスにAccess-Control-Allow-Originヘッダが付かないそうですよ。リクエストにOriginヘッダがあるかどうかをご確認ください。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問