Django-编辑器用法 | 易学教程

kindeditor编辑器下载地址

　　http://kindeditor.net/docs/index.html

setting 中配置文件：

STATIC_URL = '/static/'STATICFILES_DIRS=[    os.path.join(BASE_DIR,'static'),]MEDIA_ROOT=os.path.join(BASE_DIR,'media')MEDIA_URL = '/media/'

要植入编辑器的textarea生成视图：

<script charset="utf-8" src="/static/kindeditor/kindeditor/kindeditor-all.js"></script><script charset="utf-8" src="/static/kindeditor/kindeditor/lang/zh-CN.js"></script><script>    KindEditor.ready(function (K) {        {# textarea输入框标签选择器#}        window.editor = K.create('textarea输入框id', {

            uploadJson: '/upload/',            width: '100%',            height: '500px',            extraFileUploadParams: {                csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val()            },            afterBlur: function () {                this.sync();            },            {#                   这里相当与将文本编辑器保存不加传不到后端#}        });    });</script>模板层只需做这一步就可以 ，如果单纯的是文本输入 那么 这样已经是可以做到了，如果涉及到图片上传下载  那么 ，添加图片的上传和路由路由层：

　　path('upload/', views.upload),#上传图片路由　　re_path(r'media/(?P<path>.*)$', serve, {'document_root': settings.MEDIA_ROOT}),#访问静态文件请求走这里

视图：.将FILES管道取出图片转换成json格式

def upload(request):    img = request.FILES.get('imgFile')    path = os.path.join(settings.MEDIA_ROOT,'add_article_img',img.name)    with open(path,'wb')as f:        for line in img:            f.write(line)    response={        'error':0,        'url':'/media/add_article_img/%s'%(img.name)    }    return HttpResponse(json.dumps(response))

 这样操作等于把客户端图片写到 服务器  然后访问的时候实际上是在读服务端存的图片

　　以上！

标签

编辑器

django