django开发博客项目，使用KindEditor富文本编辑器上传图片报错（火狐和谷歌）

问题遇到的现象和发生背景

django开发博客项目，使用KindEditor富文本编辑器上传图片报错（火狐和谷歌）

问题相关代码，请勿粘贴截图

html页面：

<script>
        KindEditor.ready(function(K) {
                window.editor = K.create('#article_content',{
                    width:"800",
                    height:"600",
                    resizeType:0,
                    uploadJson:"/upload/",
                    extraFileUploadParams:{
                        csrfmiddlewaretoken:$("[name='csrfmiddlewaretoken']").val()
                    },
                    filePostName:"upload_img"
                });
        });
</script>

视图函数：

def upload(request):

print(request.FILES)
img=request.FILES.get("upload_img")
print(img.name)
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))

运行结果及报错内容

运行结果：如图

火狐报错：如下
Uncaught DOMException: Permission denied to access property "document" on cross-origin object kindeditor-all.js:3591
由于“X-Frame-Options“指令设为“DENY“，已拒绝在框架中载入。

谷歌报错：
(index):6772 crbug/1173575, non-JS module files deprecated
(anonymous) @ (index):6772
kindeditor-all.js:3591 Uncaught DOMException: Blocked a frame with origin from accessing a cross-origin frame.

都显示是引入的富文本编辑器的js文件的3591行报错
3591行的代码是

但是 上传的文件却已经上传到数据库，并且已经下载到我本地的文件夹中了

我的解答思路和尝试过的方法

我毫无头绪

我想要达到的结果

服务器返回用户上传的图片，并且在富文本编辑器中显示出来 如图，且不要一直转圈圈了 直接显示图片

下面这个是我看的视频的网址，代码都一模一样 但是视频中可以 我却报错
https://www.bilibili.com/video/BV1Gv411r75s?p=79

在settings.py中加一个配置

X_FRAME_OPTIONS = 'ALLOWALL'

已经自己搞定啦？ 去写篇博客记录一下，这样大家好查。