TYPO3 v8集成CKEditor4添加SVG标签被HTML编码问题如何解决？

该问题的核心原因是TYPO3环境下存在两层内容过滤规则：CKEditor前端编辑器层 + TYPO3后端RTE处理层，仅调整CKEditor的allowContent/extraAllowedContent参数无法生效，需同时配置两层规则。

1. 配置TYPO3后端RTE白名单 #

在站点根页面的PageTS中添加以下配置，放行SVG及内部标签的解析权限：

RTE.default {
  proc {
    # 新增svg、use标签到允许列表
    allowTags := addToList(svg, use)
    allowTagsOutside := addToList(svg, use)
    # 配置标签允许的属性，可根据实际需求增减
    HTMLparser.allowedTags {
      svg.allowedAttributes := addToList(class, id, viewBox, width, height, fill, xmlns)
      use.allowedAttributes := addToList(href, xlink:href)
    }
    # 调整转义规则
    keepnonmarkup = 1
    htmlSanitize = 0
  }
}

2. 调整CKEditor前端过滤规则 #

在自定义的CKEditor配置YAML文件中添加以下内容，关闭SVG标签自动转义：

editor:
  config:
    # 方案一：关闭全局内容过滤（适合内部使用场景）
    allowedContent: true
    # 方案二：精准放行SVG相关标签（对外站点安全要求高的场景推荐
    # extraAllowedContent: 'svg[*]; use[*]'
    # 禁用实体转义规则
    entities: false
    basicEntities: false
  }
}

3. 生效验证 #

配置完成后清空TYPO3全部系统缓存，重新进入编辑器测试：

• 切换至源码模式输入测试SVG代码：

<svg class="u-svgicon" viewBox="0 0 24 24">
  <use xlink:href="#icon-test"></use>
</svg>

• 保存后重新打开源码查看，SVG标签不会再被二次编码。

如果仍存在转义问题，可进入TYPO3后台「模板」模块的「TypoScript对象浏览器」，查看当前生效的PageTS是否被其他配置覆盖。

内容的提问来源于stack exchange，提问作者romand