OctoberCMS富文本编辑器格式丢失问题分析与解决方案

问题现象

在OctoberCMS项目中，用户报告了一个关于富文本编辑器(RichEditor)的严重问题：编辑器会意外地剥离所有HTML格式、图片和标签。这个问题不仅出现在页面插件中，也影响了营销活动插件和其他自定义插件。经过测试，该问题在OctoberCMS 3.6.26版本中依然存在，且同时出现在生产环境和本地开发环境中。

问题根源分析

经过深入调查，发现问题并非由OctoberCMS核心代码的近期变更引起。真正的原因是开发者为了实现XSS(跨站脚本)防护，在项目中添加了一个全局的中间件(Middleware)，该中间件设计用于过滤所有用户输入中的HTML标签，以防止XSS攻击。

由于这个中间件没有区分前端和后端请求，导致它对后台管理界面的富文本编辑器内容也进行了过滤处理，从而造成了所有格式和标签被意外剥离的现象。

解决方案

要解决这个问题，同时保持XSS防护的有效性，可以采用以下方法：

1. 区分前后端请求：利用OctoberCMS提供的环境检测方法，在中间件中添加对后台请求的判断

if (\App::runningInBackend()) {
    // 跳过对后台请求的HTML过滤
    return $next($request);
}

2. 选择性过滤策略：对于确实需要在前端展示富文本内容的字段，可以在模型层使用$purgeable属性来指定需要保留HTML的字段

public $purgeable = ['content']; // 指定content字段不过滤HTML

3. 白名单机制：如果需要对某些前端输入也允许HTML，可以实现基于字段名的白名单机制

最佳实践建议

1. 安全与功能的平衡：在实现安全措施时，需要考虑不同场景的需求差异。后台编辑器通常需要完整的HTML支持，而前端输入则需要更严格的控制。

2. 分层防护：建议采用多层防护策略：

   • 前端使用富文本编辑器内置的XSS防护
   • 后端针对不同场景实施差异化过滤
   • 数据库存储前进行最终净化

3. 测试覆盖：在实现安全中间件后，应该对以下场景进行全面测试：

   • 后台编辑器的各种功能
   • 前端表单提交
   • 特殊字符和HTML标签的处理

总结

OctoberCMS的富文本编辑器功能强大，但在实施安全措施时需要特别注意区分不同场景的需求。通过合理使用环境判断和分层防护策略，可以既保障系统安全，又不影响编辑器的正常功能。开发者应当根据实际业务需求，在安全性和功能性之间找到恰当的平衡点。