Python学习笔记：6.3.7 ckeditor文件上传

最新推荐文章于 2024-02-19 21:19:54 发布

VIP文章 WinvenChang

最新推荐文章于 2024-02-19 21:19:54 发布

阅读量399

点赞数

分类专栏： Python全栈工程师学习笔记文章标签： ckeditor上传文件文件上传

本文链接：https://blog.csdn.net/u014257214/article/details/104333837

版权

前言：本文是学习网易微专业的《python全栈工程师 - Flask高级建站》课程的笔记，欢迎学习交流。同时感谢老师们的精彩传授！

一、课程目标

ckeditor上传配置
ckeditor上传后端接口
ckeditor文件浏览器

二、详情解读

2.1.ckeditor上传配置

在这里插入图片描述

CKEDITOR.replace('content', {
   
	filebrowerUploadUrl: '/upload/ckeditor',
	// 这个是图片上传配置
	filebrowerImageUploadUrl: '/upload/ckeditor?type=Images'
}

2.2.后端上传处理

需要按照ckeditor的上传API接口要求返回数据：

{
   
	"uploaded": 1, // 错误为 0
	"fileName": "foo(2).jpg", // 图片原名
	"url": "/files/foo(2).jpg", // 图片上传之后的存储路径
	"error": {
   
		"message": "错误描述"
	}
}

实操：
step1：修改文件templates/artilce/post.html中ckeditor配置部分：

.
.
.
// 这里的content等于上面textarea的name属性值
CKEDITOR.replace('content', {
   
	// 新增下面这个配置
	filebrowserUploadUrl: '/upload/ckeditor'
})
.
.
.

Step2：添加ckdeditor_upload()视图函数到文件upload.py中：

# ckeditor上传图片
@upload_app.route('/ckeditor', methods=['POST'])
def ckeditor_upload():
    if request.method == 'POST':
        file_storage = request.files.get('upload')
        # 这个message的键是固定的，格式必须这么写
        message = {
   
            "upload": 0,
            "fileName": "",
            "url":