django 整合 kindeditor ,解决上传图片 csrf 验证问题

方法一:修改 kindeditor.js 文件

django在整合任何的在线编辑器的时候,上传图片通常都会遇到一个csrf验证失败的错误。

我以前的解决方法是,但是那始终是不安全的。还好找到了新的解决方法,伟大的stackoverflow

以kindeditor为例,找到主js文件,如:

/home/ubuntu/ndis/static/editor/kindeditor/kindeditor.js打开,

//NEWCODE

varcsrfitems=document.getElementsByName("csrfmiddlewaretoken");

varcsrftoken="";

if(csrfitems.length>0)

{

csrftoken=csrfitems[0].value;

}

//END

varhtml=[

'<divclass="ke-inline-block'+cls+'">',

(options.target?'':'<iframename="'+target+'"style="display:none;"></iframe>'),

(options.form?'<divclass="ke-upload-area">':'<formclass="ke-upload-areake-form"method="post"enctype="multipart/form-data"target="'+target+'"action="'+url+'">'),

'<spanclass="ke-button-common">',

hiddenElements.join(''),

//NEWCODE

'<inputtype="hidden"name="csrfmiddlewaretoken"value="',csrftoken,'"/>',

//END

'<inputtype="button"class="ke-button-commonke-button"value="'+title+'"/>',

'</span>',红色部分的代码就是我们自己加入的代码,可以让editor在上传图片的同时也post上去了csrf。

新加:

方法二:><!在kindeditor文档中查到了一个API:

extraFileUploadParams

上传图片、Flash、视音频、文件时,支持添加别的参数一并传到服务器。

•数据类型:Array

•默认值:{}

这就更好了。

修改kindeditor.html文件:

<scripttype="text/javascript">

varcsrfitems=document.getElementsByName("csrfmiddlewaretoken");

varcsrftoken="";

if(csrfitems.length>0)

{

csrftoken=csrfitems[0].value;

}

vareditor;

KindEditor.ready(function(K){

varoptions={

cssPath:('{{STATIC_URL}}editor/kindeditor/themes/default/default.css',

'{{STATIC_URL}}editor/kindeditor/plugins/code/prettify.css'),

width:'680px',

height:'400px',

filterMode:true,

uploadJson:K.undef('/upload/'),

extraFileUploadParams:{

csrfmiddlewaretoken:csrftoken

}

};

editor=K.create('textarea[name="content"]',options);

});

</script>  这样子更好一些,不用去改动kindeditor的源码。

相关推荐