एक क्षेत्र CKeditor में मानों पोस्ट पर अपलोड

मैं Django और CKEditor का उपयोग TextEdits को wysiwyg स्वाद प्रदान करने के लिए कैसे जोड़ें। मैं CKEditor फ़ाइल अपलोड फ़ंक्शन (फ़ाइलब्रोसर/छवि संवाद में) का उपयोग करना चाहता हूं, लेकिन छवि अपलोड करने के लिए CKEditor द्वारा किए गए POST में फ़ाइल डेटा शामिल है।एक क्षेत्र CKeditor में मानों पोस्ट पर अपलोड

यह सीएसआरएफ जांच के लिए एक समस्या है। मुझे सीकेएडिटर दस्तावेज में नहीं मिला और पर एक स्थान स्रोत पोस्ट करने के लिए POST डेटा में django के csrf_token जोड़ने के लिए फ़ाइल अपलोड के लिए POST डेटा बदलें।

वर्कअराउंड के रूप में, मैं अपलोड यूआरएल में सीएसआरएफ डेटा को शामिल करने के लिए filebrowserUploadUrl पैरामीटर बदल सकता हूं, अपलोड दृश्य के लिए @csrf_exempt का उपयोग कर सकता हूं, और csrf को जांचने के लिए request.GET पैरामीटर जांच सकता हूं। लेकिन क्या यह समाधान सुरक्षित है?

वैसे भी, किसी को जानता है कि कैसे CKEditor फाइल अपलोड पोस्ट डेटा के भीतर टोकन सीधे CSRF शामिल करने के लिए, मैं दृढ़ता से इसमें रुचि है ...

स्रोत

2012-05-01 jmbarbier

आप उपयोग कर रहे हैं [Django-CKEditor] (http://pypi.python.org/pypi/django-ckeditor) या किसी अन्य विजेट? यदि आप इसे स्वयं लिख रहे हैं - यह सही है, तो आप पोस्ट में कुछ जोड़ नहीं सकते क्योंकि पोस्ट किया गया शरीर फ़ाइल ही है। तो हाँ, आपको यूआरएल पैरामीटर में टोकन प्रदान करने की आवश्यकता है। – ilvar

भी django-CKEditor फ़ाइल अपलोड करने के लिए CSRF संरक्षण का उपयोग नहीं करता है (और यह बुरा IMHO है): def अपलोड @csrf_exempt (अनुरोध): "" " एक फ़ाइल अपलोड कर CKEditor के लिए इसका URL वापस भेज कार्यसूची:। अपलोड "" " – jmbarbier

आप dialogDefinition घटना के लिए रजिस्टर कर सकते हैं, और पूरी तरह से अपलोड टैब को फिर से लिखने, इस प्रकार:

CKEDITOR.on('dialogDefinition', function (ev) { 
    var dialogName = ev.data.name; 
    var dialogDefinition = ev.data.definition; 
    if (dialogName == 'image') { 
    dialogDefinition.removeContents('Upload'); 
    dialogDefinition.addContents({ 
     title: "Upload", 
     id: "upload", 
     label: "Upload", 
     elements: [{ 
     type: "html", 
     html: '<form><input id="imageupload" type="file" name="files[]" />{%csrf_token%}</form>' 
     }] 
    }); 
    } 
});

यह एक अपरीक्षित है मेरे असली दुनिया संस्करण का सरलीकरण, लेकिन उम्मीद है कि यह विचार दिखाता है।

यह छवि संवाद में यूआरएल फ़ील्ड सेट नहीं करता है, इसलिए संवाद पर ठीक क्लिक करने से आपको एक त्रुटि संदेश मिल जाएगा। आप स्थापित करने के लिए है कि एक सफल अपलोड पर, इस प्रकार की आवश्यकता होगी:

CKEDITOR.dialog.getCurrent().getContentElement('info', 'txtUrl').setValue(theURL);

स्रोत

2013-11-06 15:36:34

वाह, पुराने सवाल :-) धन्यवाद करने के लिए नए सिरे से प्रतिक्रिया मान्य करें !! ... अपने तरीके से कहीं अधिक मेरी CKEditor कोड में हैकिंग से क्लीनर है। अगली बार मैं ckeditor का उपयोग करना होगा मैं अपने तरीके से कोशिश करूंगा। – jmbarbier

मुझे मिल रहा है: "Uncaught TypeError: संपत्ति को नहीं पढ़ सकता है '0C मुझे क्या याद आ रही है? – Mladen

ऐसा लगता है कोई रास्ता नहीं संपादन के बिना CKEditor अपलोड डेटा के लिए डेटा जोड़ने के लिए है कि वहाँ ckeditor स्रोत कोड। संशोधित करने के लिए स्रोत कोड प्लगइन/संवाद/प्लगइन.जेएस है, सीकेडिटर 3.6.2 में लाइन 1440 के आसपास, जहां ckeditor अपलोड iframe द्वारा प्रयुक्त फॉर्म बनाता है।

// ADDED TO CKEDITOR CODE %< 
var csrfitems = document.getElementsByName("csrfmiddlewaretoken") 
var csrftoken = "" 
if(csrfitems.length > 0) 
    csrftoken = csrfitems[0].value 
// >% END OF ADDED CODE 
if (elementDefinition.size) 
    size = elementDefinition.size - (CKEDITOR.env.ie ? 7 : 0); // "Browse" button is bigger in IE. 
frameDocument.$.write([ '<html dir="' + langDir + '" lang="' + langCode + '"><head><title></title></head><body style="margin: 0; overflow: hidden; background: transparent;">', 
'<form enctype="multipart/form-data" method="POST" dir="' + langDir + '" lang="' + langCode + '" action="', 
CKEDITOR.tools.htmlEncode(elementDefinition.action), 
'">', 
// ADDED TO CKEDITOR CODE 
    '<input type="hidden" name="csrfmiddlewaretoken" value="',csrftoken,'"/>', 
    // >% END OF ADDED CODE 
'<input type="file" name="', 
CKEDITOR.tools.htmlEncode(elementDefinition.id || 'cke_upload'), 
'" size="', 
CKEDITOR.tools.htmlEncode(size > 0 ? size : ""), 
'" />', 
'</form>',

और अब हम सुरक्षित रूप से उपयोग कर सकते हैं Django के साथ CKEditor में अपलोड

स्रोत

2012-05-04 21:31:02 jmbarbier

अतिरिक्त सर्वर के लिए भेजा डेटा प्राप्त अनुरोध द्वारा पारित कर दिया है। मैं अतिरिक्त डेटा जोड़ने के लिए और अंत में यह है कि डेटा

CKEDITOR.on('dialogDefinition', function(ev) 
    { 
    var dialogName = ev.data.name; 
    var dialogDefinition = ev.data.definition; 
    if (dialogName == 'image') 
    { 
      dialogDefinition.contents[2].elements[0].action += '&pin=123456'; 
      /* 2 is the upload tab it have two elements 0=apparently is the 
      and 1: is the button to perform the upload, in 0 have the action property with the parameters of the get request simply adding the new data    
       */ 

    } 
    });

स्रोत

2014-07-02 22:21:34

मैं एक ऐसी ही समस्या का सामना करना जब Elgg के लिए CKEditor के माध्यम से छवि अपलोड करने को एकीकृत भेजने के लिए प्रयोग किया जाता है प्रपत्र की एक url पैरामीटर को जोड़ने प्राप्त कोशिश कर रहा था।

CKEDITOR.on('dialogDefinition', function (ev) { 
    var dialogName = ev.data.name; 
    var dialogDefinition = ev.data.definition; 

    if (dialogName === 'image') { 
     var uploadTab = dialogDefinition.getContents('Upload'); 

     for (var i = 0; i < uploadTab.elements.length; i++) { 
      var el = uploadTab.elements[i]; 

      if (el.type !== 'fileButton') { 
       continue; 
      } 

      // add onClick for submit button to add inputs or rewrite the URL 
      var onClick = el.onclick; 

      el.onClick = function(evt) { 
       var dialog = this.getDialog(); 
       var fb = dialog.getContentElement(this['for'][0], this['for'][1]); 
       var action = fb.getAction(); 
       var editor = dialog.getParentEditor(); 
       editor._.filebrowserSe = this; 

       // if using jQuery 
       $(fb.getInputElement().getParent().$).append('<input type="hidden" name="foo" value="bar">'); 

       // modifying the URL 
       fb.getInputElement().getParent().$.action = '/my/new/action?with&query&params=1'; 


       if (onClick && onClick.call(evt.sender, evt) === false) { 
         return false; 
       } 

       return true; 
      }; 
     } 
    } 
});

स्रोत

2014-10-17 20:03:01 Brett

सवाल बहुत पुराना है लेकिन ...

संस्करण 4.5 आप: कम से कम दखल समाधान मैं के साथ आया था onClick ईवेंट के लिए बाध्य करने के लिए सबमिट बटन और उस से सीधे रूप संशोधित करने के लिए था किसी भी अनुरोध

editor.on('fileUploadRequest', function(evt) { 
    var xhr = evt.data.fileLoader.xhr; 

    xhr.setRequestHeader('Cache-Control', 'no-cache'); 
    xhr.setRequestHeader('csrf header ', 'HEADER'); 
    xhr.withCredentials = true; 
});

स्रोत

2015-12-10 23:51:33

डिफ़ॉल्ट मानते हुये अपलोड के साथ काम नहीं करता: http://stackoverflow.com/questions/34851158/ckeditor-4-5-fileuploadrequest-event-not-firing –

आप HTTPS भर URL में एक CSFR टोकन भेज रहे हैं प्रदान में हुक जोड़ सकते हैं यह उस के साथ (देखने के एक सुरक्षा पिंट से) और यह भी एक बहुत आसान निपटने के लिए क्या करने के लिए ठीक होना चाहिए।

यह मानता है कि django उस चर को पढ़ सकता है या आप आसानी से django को संशोधित करने में सक्षम हैं। ये उत्तर CKeditor को बदलने की कोशिश कर रहे हैं थोड़ा अधिक काम इमो लगता है।

के रूप में अपने CSFR_token रूप में लंबे समय सर्वर इसे अगर यह पोस्ट के माध्यम से है कोई फर्क नहीं पड़ता या प्राप्त करने के लिए एक सुरक्षित तरीके से उपयोगकर्ताओं को ब्राउज़र द्वारा भेजा जा रहा है। खेल पर सुरक्षा चिंता मध्य हमले में एक आदमी है, यानी आप नहीं चाहते हैं कि उपयोगकर्ता सीएसएफआर_टोकन को सादे पाठ में प्रसारित किया जाए।

इस तरह के डेटा को कड़ाई से बोलने के लिए HTTP spec के अनुसार POST के रूप में भेजा जाना चाहिए, लेकिन ऐसा लगता है कि जीईटी प्रोटोकॉल का 'दुरुपयोग' स्वीकार्य हो सकता है क्योंकि आपके पास विशेष रूप से सीकेएडिटर कोड पर नियंत्रण नहीं है सुरुचिपूर्ण तरीका

इसके अलावा, आप बाहर पकड़े सकता है अगर CKEditor एक उन्नत में चीजों को बदलता है, URL हमेशा काम करेंगे के माध्यम से टोकन गुजर।

स्रोत

2017-10-13 10:28:05 user1209203

एक क्षेत्र CKeditor में मानों पोस्ट पर अपलोड

उत्तर

संबंधित मुद्दे