Django3.X使用富文本编辑器kindereditor上传图片时一直转圈圈，如何解决

标签：文本编辑 kindereditor name 上传 Django3 file path article os

问题描述：

在写bbs项目的时候，老师用的是Django1.X结合富文本编辑器kindeditor，实现了图片上传，但是我在用Django3.X的时候，代码和老师一模一样，上传图片的时候一直转圈圈？？？但是文件夹article_img已经创建，并且图片已经成功上传到服务端。

如下图：

各部分代码截图如下

add_article.html

 

{% extends 'backend/backend_base.html' %}

{% block article %}
    <h3>添加文章</h3>
    <form action="" method="post" enctype="multipart/form-data">
        {% csrf_token %}
        <p>标题</p>
        <div>
            <input type="text" name="title" class="form-control">
        </div>
        <p>内容</p>
        <div>
            <textarea name="content" id="id_content" cols="60" rows="10"></textarea>
        </div>
        <p>分类</p>
        <div>
            {% for category in category_list %}
                <input type="radio" value="{{ category.pk }}" name="category">{{ category.name }}
            {% endfor %}
        </div>

        <p>标签</p>
        <div>
            {% for tag in tag_list %}
                <input type="checkbox" value="{{ tag.pk }}" name="tag">{{ tag.name }}
            {% endfor %}

        </div>
        <input type="submit" class="btn btn-danger">
    </form>
{% endblock %}

{% block js %}
    {% load static %}
    <script charset="utf-8" src="{% static 'kindeditor/kindeditor-all-min.js' %}"></script>
    <script>
        KindEditor.ready(function (K) {
            window.editor = K.create('#id_content', {
                width : '100%',
                height:'700px',
                resizeType:1,
                uploadJson : '/upload_image/',
                extraFileUploadParams : {
                        'csrfmiddlewaretoken':'{{ csrf_token }}'
                }
}
            );
        });
    </script>
{% endblock %}

View Code

 

 

urls.py

 

 

    # 上传图片
    path(r'upload_image/', views.upload_image),

 

views.py

 

 

import os
from BBS20230205 import settings
def upload_image(request):
    back_dic = {'error': 0, }
    if request.method == 'POST':

        file_obj = request.FILES.get('imgFile')
        file_dir = os.path.join(settings.BASE_DIR, 'media','article_img')
        if not os.path.isdir(file_dir):
            os.mkdir(file_dir)
        file_path = os.path.join(file_dir, file_obj.name)
        with open(file_path, 'wb') as f:
            for line in file_obj:
                f.write(line)
        back_dic['url'] = '/media/article_img/%s' %file_obj.name
    return JsonResponse(back_dic)

View Code

 

 

 

经过我的百度，终于找到了答案：只需要在settings.py中写下面一句代码：

X_FRAME_OPTIONS = 'ALLOWALL'

赶紧记录成博客，让大家也可以避坑，自己下次也可以方便找到答案！！！

 

标签：文本编辑,kindereditor,name,上传,Django3,file,path,article,os
From： https://www.cnblogs.com/MRPython/p/17100135.html