DjangoのAJAXエラー：sellbill：クロスオリジン・リクエストは唯一私がbillbrainロードすることはできませんAJAX呼び出し</p> <p>のXMLHttpRequestに関しては、次のエラーを取得しています

Question

プロトコルスキームのためにサポートされています。 Cross originリクエストは、http、data、chrome、chrome-extension、https、chrome-extension-resourceのプロトコルスキームでのみサポートされています。

billbrainは私のdjangoアプリ名ですが、sellbillは販売用請求書ビューのURL名です。明示的にDRYに違反するURLを述べるならば、今すぐ

$.ajax({ 
     url : "billbrain:sellbill", 
     type : "POST", d 
     data : { customer_code: input }, // data sent with the post request 

       // handle a successful response 
     success : function(json) { 
      console.log(json); // log the returned json to the console 
      console.log("success"); // another sanity check 
     }, 
    }); 

：後

は私のAJAX（ジャンゴ）コードです。では、ベストプラクティスは何ですか？

Answer 1

を使用しますcsrfトークンとあなたはajaxのURLでこれを書くことができませんでした。あなたは以下のコードのように書くべきです。

インラインjsをお持ちの場合は、それ以外の場合は、2つの変数をレンダリングするテンプレートに追加する必要があります。なぜなら、インポートされたJSにdjangoの変数を使用することはできないからです。

このコードはちょうどテンプレートの一番下に置きます。

<script> 
url_sellbill = '{% url 'billbrain:sellbill' %}'; 
csrf_token = '{{ csrf_token }}'; 
</script> 

以下のコードをjsに入れます。

$.ajax({ 
     url : url_sellbill, 
     type : "POST", d 
     data : { 
       customer_code: input, 
       'csrfmiddlewaretoken': csrf_token, 

     }, // data sent with the post request 

     // handle a successful response 
     success : function(json) { 
      console.log(json); // log the returned json to the console 
      console.log("success"); // another sanity check 
     }, 
    }); 

うまくいけば、それはうまくいくでしょう。 :)

Answer 2

あなたはURLを含むベーステンプレートグローバルオブジェクトに宣言し、urlテンプレートタグ使用することができます。

<script> 
    windows.ajaxUrls = { 
     'billbrain-sellbill': {% url 'billbrain:sellbill' %} 
    } 
</scrip> 

とJSファイル内：

$.ajax({ 
    url : window.ajaxUrl['billbrain-sellbill'], 
    ... 
}); 

か、渡す必要がありますhttps://github.com/mlouro/django-js-utils