2011-12-23 10 views
18

मेरे पास 2 एचटीएमएल पेज हैं।Jquery और Django CSRF टोकन

एक अभिभावक पृष्ठ और एक बाल पृष्ठ। चाइल्ड पेज में एक सबमिट बटन होता है जो अजाक्स संदेश सबमिट करने के लिए अभिभावक पृष्ठ पर कोड चलाता है।

मैं $ .load() विधि का उपयोग कर बच्चे पृष्ठ लोड करता हूं और फिर जब बटन क्लिक किया जाता है तो यह $ .ajax .POST विधि चलाता है। यह पोस्ट विधि केवल पायथन कोड पर एक JSON स्ट्रिंग पास करती है।

जब मैं आईई को छोड़कर किसी भी ब्राउज़र पर ऐसा करता हूं तो यह ठीक काम करता है। हालांकि जब मैं आईई में यह कोड चलाता हूं। मुझे सीएसआरएफ टोकन के बारे में पाइथन/Django त्रुटियां मिलती हैं।

I सोचें कारण यह है कि बाल पृष्ठ केवल सर्वर पेज को चलाने के साथ ही वर्तमान पृष्ठ का ताज़ा है।

क्या कोई जानता है कि मुझे इसे काम करने के बारे में कैसे जाना चाहिए।

चीयर्स,

उत्तर

29

आप पोस्ट साथ CSRF टोकन गुजर नहीं कर रहे हैं। डेटा में मैंने जो किया है, उसे करने का प्रयास करें। यह सीएसआरएफ टोकन (या अपनी खुद की विधि) लाने और इसे अपने तर्कों में पारित करने के लिए है।

$.ajax({ 
    url : url, 
    type: "POST", 
    data : {csrfmiddlewaretoken: document.getElementsByName('csrfmiddlewaretoken')[0].value}, 
    dataType : "json", 
    success: function(data){ 
     // do something 
    } 
}); 
+0

एक आकर्षण की तरह काम किया। बहुत धन्यवाद :-) – TheMonkeyMan

+4

यह दृष्टिकोण ठीक है, लेकिन यदि आप कई AJAX अनुरोध कर रहे हैं, तो आपको इसके बजाय हेडर के रूप में CSRF टोकन को पास करने के लिए और अधिक सुविधाजनक लग सकता है। अधिक जानकारी के लिए [django दस्तावेज़] (https://docs.djangoproject.com/en/dev/ref/contrib/csrf/#ajax) देखें। – Alasdair

+7

मुझे 'डेटा मिलता है: {..., 'csrfmiddlewaretoken': '{{csrf_token}}'}, ... 'अधिक सरल। – Tuttle

5

CSRF और AJAX पर docs से:

CSRF टोकन भी डोम में मौजूद है, लेकिन केवल तभी जब स्पष्ट रूप से एक टेम्पलेट में csrf_token का उपयोग कर शामिल थे। कुकी में कैनोलिक टोकन होता है; CsrfViewMiddleware डोम में टोकन को कुकी पसंद करेगा। भले ही, यदि टोक़ DOM में मौजूद है तो कुकी होने की गारंटी है, इसलिए आपको कुकी का उपयोग करना चाहिए!

उदाहरण(भी डॉक्स से)

// using jQuery 
function getCookie(name) { 
    var cookieValue = null; 
    if (document.cookie && document.cookie != '') { 
     var cookies = document.cookie.split(';'); 
     for (var i = 0; i < cookies.length; i++) { 
      var cookie = jQuery.trim(cookies[i]); 
      // Does this cookie string begin with the name we want? 
      if (cookie.substring(0, name.length + 1) == (name + '=')) { 
       cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); 
       break; 
      } 
     } 
    } 
    return cookieValue; 
} 

var csrftoken = getCookie('csrftoken'); 

या कुकीज़ के साथ बातचीत के किसी अन्य तरीके से इस्तेमाल किया जा सकता।

6

यदि आप POST अनुरोध निकाय भेज रहे हैं तो सीएसआरएफ टोकन को इसके बजाय अनुरोध शीर्षलेख के रूप में जोड़ना आसान हो सकता है। मुझे यह दृष्टिकोण पढ़ने में आसान लगता है, क्योंकि यह टोकन के साथ अनुरोध निकाय को अव्यवस्थित नहीं करता है। अधिकांश AJAX अनुरोध डीजेंगो दस्तावेज़ द्वारा सुझाए गए अनुसार हेडर के रूप में csrf टोकन भेज देगा।

function startTest(testId) { 
    var payload = JSON.stringify({ 
    test_id : testId 
    }); 
    $.ajax({ 
    url: "/test-service/", 
    method: "POST", 
    headers: {'X-CSRFToken': '{{ csrf_token }}'}, 
    data: payload, 
    dataType: "json" 
    }).done(function(response) { 
    console.log(response.id + " " + response.name); 
    }).fail(function (error) { 
     console.log(error); 
    }); 
} 
संबंधित मुद्दे