AJAX 呼び出し用の API を作成するときに Django で発生するクロスドメインの問題を考慮して、AJAX クロスドメイン アクセスの問題、特にオープンソースとして共有されている django-cors-headers の使用を解決するための Python の Django アプリケーションの方法をまとめてみましょう。
はじめに
Django を使用してサーバー側で API を作成し、JSON データを返します。 Ajax を使用して API を呼び出します:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/> <title>test</title> </head> <body> <button onclick="showPersonInfo()">点我获取数据</button> </body> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script> function showPersonInfo(){ $.getJSON( 'http://xxx/account/getuserinfo/', {username: "abc"}, function(json) { var html='<br>'+'用户名:'+json.username+'<br>'+'姓:'+json.first_name+'<br>'+'名:'+json.last_name+'<br>'+'邮箱'+json.email; document.write(html); } ) } </script> </html>
ただし、Chrome ブラウザではエラーが表示されます:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Google で調べたところ、この問題は CORS が原因であることがわかりました。
CORSとは何ですか?
CORS (Cross-Origin Resource Sharing) は、Ajax がクロスドメイン アクセスを実現できるようにするクロスドメイン アクセス メカニズムです。
実際には、サーバーの応答ヘッダーに「Access-Control-Allow-Origin: *」を追加して CORS をサポートします。apache/nginx の設定方法などは、参考ドキュメントを参照してください。
例:
API は DomainA にデプロイされ、
Ajax ファイルは DomainB にデプロイされ、Ajax ファイルは API にリクエストを送信し、
を通じて DomainB の Ajax ファイルにアクセスします。 DomainC. データのリクエスト
上記のプロセスでクロスドメイン アクセスが発生します。 Ajax を直接使用してリクエストすると、Chrome のプロンプトが表示され、失敗します:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Ajax クロスドメイン アクセスの問題を解決するにはどうすればよいですか?
クロスドメインの問題を解決するには、2 つの方法があります: 1. jsonp を使用する 2. CORS を有効にする
jsonp メソッドを使用するには、サーバーに応答を jsonp 形式で戻す必要があります。たとえば、Django は次のことを行うことができます。 http://www.php.cn/ などの jsonp 関連のデコレータを追加します。この方法はあまり好きではないので、ここでは省略します。後で参考資料を参照してください。
CORS を使用する: 現在、ほとんどのブラウザーが CORS をサポートしており、他のユーザーが呼び出すことができるように完全にオープンになっているため、CORS を使用することをお勧めします。
1. JSONP の使用
Ajax を使用して json データを取得する場合、クロスドメインの制限があります。ただし、Web ページ上で js スクリプト ファイルを呼び出す場合、JSONP はこれを使用してクロスドメイン送信を実現します。したがって、Ajax 呼び出しの dataType を JSON から JSONP 形式に変更する必要があります (対応する API も JSONP をサポートする必要があります)。
JSONP は GET リクエストにのみ使用できます。
2. Django で views.py ファイルを直接変更します。
他のドメインが Ajax 経由でデータをリクエストできるように、views.py の対応する API 実装関数を変更します:
def myview(_request): response = HttpResponse(json.dumps({"key": "value", "key2": "value"})) response["Access-Control-Allow-Origin"] = "*" response["Access-Control-Allow-Methods"] = "POST, GET, OPTIONS" response["Access-Control-Max-Age"] = "1000" response["Access-Control-Allow-Headers"] = "*" return response
3. - cors-headers
ここでまた発見がありました! Django では、誰かが CORS ヘッダー ミドルウェアを開発しました。settings.py でいくつかの簡単な設定を行うだけで、これを使用できるようになり、サーバー側が完全にオープンになります。 CORS をオンにすると、クロスドメインの心配がなくなります。 ~ django-cors-headers をインストールします:
pip install django-cors-headerssettings.py に追加します:
INSTALLED_APPS = ( ... 'corsheaders', ... ) ... MIDDLEWARE_CLASSES = ( ... 'corsheaders.middleware.CorsMiddleware', 'django.middleware.common.CommonMiddleware', ... )クロスドメイン アクセスを許可するホワイトリストを構成することも、すべてのクロスドメイン アクセスを許可するように直接設定することもできます特定の構成については、github ページの手順を参照してください。