Python の Django アプリケーションは AJAX クロスドメイン アクセスを解決します

高洛峰
リリース: 2017-03-02 15:50:43
オリジナル
1445 人が閲覧しました

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(
        &#39;http://xxx/account/getuserinfo/&#39;,
        {username: "abc"},
        function(json) {
          var html=&#39;<br>&#39;+&#39;用户名:&#39;+json.username+&#39;<br>&#39;+&#39;姓:&#39;+json.first_name+&#39;<br>&#39;+&#39;名:&#39;+json.last_name+&#39;<br>&#39;+&#39;邮箱&#39;+json.email;    
          document.write(html);
        }
      )
    }
  </script>
</html>
ログイン後にコピー

ただし、Chrome ブラウザではエラーが表示されます:

No &#39;Access-Control-Allow-Origin&#39; 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 &#39;Access-Control-Allow-Origin&#39; 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-headers
ログイン後にコピー

settings.py に追加します:

INSTALLED_APPS = (
  ...
  &#39;corsheaders&#39;,
  ...
)

...

MIDDLEWARE_CLASSES = (
  ...
  &#39;corsheaders.middleware.CorsMiddleware&#39;,
  &#39;django.middleware.common.CommonMiddleware&#39;,
  ...
)
ログイン後にコピー

クロスドメイン アクセスを許可するホワイトリストを構成することも、すべてのクロスドメイン アクセスを許可するように直接設定することもできます特定の構成については、github ページの手順を参照してください。


AJAX クロスドメイン アクセスを解決する Python の Django アプリケーションに関連するその他の記事については、PHP 中国語 Web サイトに注目してください。



関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!