在Django项目中集成现代CKEditor 5富文本编辑器的完整指南
Django 官方建议开发者停止使用存在安全风险的 CKEditor 4,转而迁移至符合现代标准的 CKEditor 5。本文详细讲解如何借助 django-ckeditor-5 在 Django 项目中安全、高效地集成 CKEditor 5,并提供清晰的配置步骤与关键注意事项。
首先交代一个重要背景:CKEditor 4 自 2023 年底起官方已终止维护,4.22.1 版本中遗留了一个至今未修复的安全漏洞。Django 生态中的传统插件 django-ckeditor(即原 v6.x)启动时会弹出 W001 警告,强烈催促开发者迁移。官方力推的 CKEditor 5 才是下一代富文本编辑器:模块化架构、良好的可访问性、兼容 Webpack 与 ESM,并且会持续获得安全更新——这才是真正值得使用的方案。
目前 Django 领域最成熟、专门适配 CKEditor 5 的解决方案,是 django-ckeditor-5(由 hvlads 维护,可在 GitHub 找到)。它并非简单的封装,而是深度集成了 Django 的表单、模型字段和 Admin 界面,默认采用 CKEditor 5 的开源社区版(MIT 协议),无论是开源项目还是大多数商业项目都无需付费购买授权。
下面直接给出集成步骤,按顺序执行即可。
第一步:安装依赖
一条命令完成:
pip install django-ckeditor-5
第二步:注册应用
在 settings.py 的 INSTALLED_APPS 中添加:
INSTALLED_APPS = [
# ... 其他应用
'django_ckeditor_5',
]
第三步:配置工具栏与功能
此步骤可选但强烈建议执行——你可以决定编辑器中显示哪些按钮,以及图片上传、表格等高级功能是否启用。以下提供一套默认配置和一套扩展配置,复制到 settings.py 后按需调整:
# settings.py
CKEDITOR_5_CONFIGS = {
'default': {
'toolbar': ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList', 'blockQuote', 'undo', 'redo'],
'height': 300,
},
'extends': {
'blockToolbar': [
'paragraph', 'heading1', 'heading2', 'heading3',
'|',
'bulletedList', 'numberedList',
'|',
'imageUpload', 'table', 'mediaEmbed'
],
'toolbar': ['heading', '|', 'outdent', 'indent', '|', 'bold', 'italic', 'link', 'underline', 'strikethrough', 'codeBlock', 'subscript', 'superscript', 'highlight', '|', 'bulletedList', 'numberedList', 'todoList', '|', 'blockQuote', 'insertImage', 'insertTable', 'mediaEmbed', 'undo', 'redo'],
'image': {
'toolbar': ['imageTextAlternative', '|', 'imageStyle:alignLeft', 'imageStyle:alignCenter', 'imageStyle:alignRight'],
'styles': ['full', 'alignLeft', 'alignCenter', 'alignRight']
}
}
}
第四步:在模型中使用富文本字段
先导入字段类:
# models.py from django.db import models from django_ckeditor_5.fields import CKEditor5Field
然后在模型中使用 CKEditor5Field 替换传统的 TextField,并指定之前配置的 config_name:
class Article(models.Model):
title = models.CharField(max_length=200)
content = CKEditor5Field(config_name='default') # 或 'extends'
第五步:Admin 后台自动适配
这一点极为省心——只要字段类型是 CKEditor5Field,Django Admin 就会自动渲染出对应的编辑器,完全无需重写 ModelAdmin.formfield_overrides。换句话说,模型配置好之后,后台直接就能使用漂亮的富文本编辑框。
几个常见的踩坑点
- CDN 加载问题:库默认从 CDN 拉取 CKEditor 5 的构建文件(
@ckeditor/ckeditor5-build-classic)。如果你的项目需要离线部署或自定义编辑器构建,必须参考官方文档配置本地build路径。 - 图片上传配置:库内置了
upload视图,可自动注册 URL。记得在项目主urls.py中添加以下代码:from django_ckeditor_5 import urls as ckeditor5_urls urlpatterns += [path("ckeditor5/", include(ckeditor5_urls)),] - REST Framework 场景:该库目前没有直接提供序列化器支持。如果你使用 DRF,手动处理 HTML 字段的清洗与验证是必需的——推荐搭配
bleach库来过滤 XSS 攻击。 - 不要购买 CKEditor 4 LTS 商业版:那个版本按域名或用户数收费,限制严格,长期来看技术债难以消化。直接拥抱 CKEditor 5 才是正确的方向。
总结
django-ckeditor-5 是目前 Django 生态中兼顾安全性、易用性和扩展性的最佳选择。迁移成本极低——替换 pip 包、修改字段类型即可。文档完善、社区活跃,已在不少中大型生产项目中稳定运行。抓住时机尽快升级,告别过时编辑器带来的合规与安全风险。
游乐网为非赢利性网站,所展示的游戏/软件/文章内容均来自于互联网或第三方用户上传分享,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系youleyoucom@outlook.com。
同类文章
PyTorch中使用多维索引张量对高维张量批量索引的正确方法
本文深入讲解如何在 PyTorch 中利用形状为 [b, k] 的索引张量 B,对形状为 [b, m, n] 的高维张量 A 执行高效批量索引,最终得到 [b, k, n] 的输出。核心思路在于合理扩展索引维度并配合 torch gather 实现精准的逐行抽取。 很多人处理高维张量的批量索引时都会
Go中...操作符解包切片传递可变参数函数
在 Go 语言中,` ` 运算符放在切片变量后面(如 `slice `)的作用是将该切片“展开”为多个独立参数,专门用于调用那些接受可变参数(` T`)的函数,例如 `append` 或 `fmt Println`。这是一种类型安全的语法糖,并非省略号或通配符,能够帮助开发者更简洁地处理
macOS与WSL2下PHP多版本切换失效问题排查与修复指南
本文深入分析在 macOS 或 WSL2(Ubuntu)开发环境中,通过 Homebrew 管理 PHP 多版本时,php -v 始终显示旧版本(如 php@5 6)的深层原因,并给出系统性解决方案,覆盖 PATH 冲突、符号链接逻辑、Shell 初始化配置、系统残留配置等关键环节。 遇到这种情况的
PHP JSON解析深层嵌套对象属性访问失败的解决方法
使用 json_decode() 解析 API 返回的 JSON 数据时,经常遇到某个子属性无法正常获取,始终返回 NULL —— 这是许多 PHP 开发者都曾碰到过的棘手问题。通常并非数据丢失,而是对象嵌套层级比预期更深,导致访问路径不正确。 举例来说,你看到返回的 JSON 里有一个 appea
nnU-Net v2预处理卡死问题的成因分析与实用解决指南
> 使用 nnUNetv2_plan_and_preprocess 处理大规模数据集(例如 704 例样本)时,程序常因多进程加载导致死锁而停滞。核心原因在于默认并发数过高引发资源竞争或 I O 阻塞,适当降低并发数即可稳定完成全量预处理。 你在使用 `nnunetv2_plan_and_prepr
- 日榜
- 周榜
- 月榜
相关攻略
2026-07-03 06:53
2026-07-03 06:53
2026-07-03 06:53
2026-07-03 06:53
2026-07-03 06:53
2026-07-03 06:52
2026-07-03 06:52
2026-07-03 06:52
热门教程
- 游戏攻略
- 安卓教程
- 苹果教程
- 电脑教程
热门话题

