为 TinyMCE 配置内容安全策略 (CSP)

TinyMCE 可以与 CSP 标头一起使用。使用 CSP 时,以下指令对于 TinyMCE 的正常运行是必需的:

策略指令原因

script-src 'self' *.tinymce.com *.tiny.cloud;

脚本有时会作为带有 src 属性的 script 元素加载。

connect-src 'self' *.tinymce.com *.tiny.cloud blob:;

拼写检查和 PowerPaste 等一些服务需要 XMLHttpRequest。

img-src 'self' *.tinymce.com *.tiny.cloud data: blob:;

编辑器中的图像有时是 base64 编码的、blob URL 或通过 Tiny Cloud 服务代理的。

style-src 'self' 'unsafe-inline' *.tinymce.com *.tiny.cloud;

样式用于内联格式(如下划线、字体颜色等)和用户界面元素的定位。

font-src 'self' *.tinymce.com *.tiny.cloud;

字体用于 UI 中的图标,并从外部文件加载。

有一种 CSP 的加固方法,通常称为严格 CSP。严格 CSP:

  1. 对所有 <script> 元素使用 nonce;

  2. 在每次页面加载时重新生成每个 nonce;

  3. 重构内联事件处理程序,使其从 JavaScript 块中添加;并且

  4. 不允许在任何指令中使用 unsafe-inline 值。

但是,TinyMCE 目前需要在 style-src 指令中使用 unsafe-inline 值来呈现除纯文本以外的内容。

因此,目前不支持在严格 CSP 配置中运行 TinyMCE。

此外,上述必需的指令会阻止从任何外部来源加载内容。要允许来自特定来源的内容,请将来源域添加到相关指令中。例如,要允许 YouTube 视频:

media-src 'self' *.youtube.com;

要允许来自任何来源的内容,请使用 (*) 通配符。允许所有来源(使用 *)会取消该来源类型的安全策略。例如:

media-src *;

有关内容安全策略的信息,请参阅:MDN Web 文档 - 内容安全策略 (CSP)。

使用 Tiny Cloud 时,请使用此 CSP 标头:

<meta
  http-equiv="Content-Security-Policy"
  content="default-src 'none'; script-src 'self' *.tinymce.com *.tiny.cloud; connect-src 'self' *.tinymce.com *.tiny.cloud blob:; img-src 'self' *.tinymce.com *.tiny.cloud data: blob:; style-src 'self' 'unsafe-inline' *.tinymce.com *.tiny.cloud; font-src 'self' *.tinymce.com *.tiny.cloud;"
>

在本地域中自托管 TinyMCE 时,请使用此 CSP 标头(不包括 *.tiny.cloud 域):

<meta
  http-equiv="Content-Security-Policy"
  content="default-src 'none'; script-src 'self'; connect-src 'self' blob:; img-src 'self' data: blob:; style-src 'self' 'unsafe-inline'; font-src 'self';"
>

防火墙和代理白名单

在限制出站互联网访问的防火墙或正向代理后面运行的组织必须将 Tiny Cloud 域添加到白名单。TinyMCE 云托管功能需要浏览器向这些域发出出站 HTTPS 请求;不需要来自 Tiny Cloud 的入站访问。

必需的域

将以下通配符域添加到白名单以覆盖所有 Tiny Cloud 服务:

*.tiny.cloud

这一个条目涵盖了所有云托管服务,包括但不限于:

不连接到任何 Tiny Cloud 服务的自托管部署不需要此白名单。对于本地文档转换器或 AI 等自托管服务,请将自托管服务运行的域添加到白名单。

必需的 HTTP 标头

确保代理在对 *.tiny.cloud 域的请求中保留(不剥离)以下 HTTP 标头:

  • tiny-api-key

  • tinymce-api-key

这些标头是API密钥验证和服务身份认证所必需的。

内容安全策略相关选项

content_security_policy

此选项允许为编辑器iframe内容设置自定义内容安全策略。

类型: String

示例:使用 content_security_policy

tinymce.init({
  selector: 'textarea',  // 根据需要修改此值以匹配您的HTML
  content_security_policy: "default-src 'self'"
});