关于通用编辑器 universal-editor
了解通用编辑器的灵活性，以及它如何帮助您使用AEM 6.5 LTS增强Headless体验。
概述 overview
通用编辑器是一个多功能可视化编辑器，是 Adobe Experience Manager Sites 的一部分。它允许作者对任何Headless体验进行“所见即所得”(WYSIWYG)编辑。
- 作者受益于通用编辑器的灵活性。 它支持对所有形式的AEM Headless内容进行相同一致的可视化编辑。
- 开发人员同样能够从通用编辑器的多样性中获益，因为它还支持对实施的真正解耦。它使开发人员几乎可以使用他们选择的任何框架或架构，而无需施加任何SDK或技术限制。
请参阅 AEM as a Cloud Service 文档中有关通用编辑器的章节，以了解更多详细信息。
架构 architecture
通用编辑器是一项与 AEM 协同工作的服务，用于以 Headless 方式创作内容。
- 通用编辑器托管在
https://experience.adobe.com/#/aem/editor/canvas，可以编辑AEM 6.5 LTS渲染的页面。 - 通用编辑器从AEM创作实例中通过Dispatcher读取AEM页面。
- 运行在与 Dispatcher 相同的主机上的通用编辑器服务会将更改写回 AEM 作者实例。
要求 requirements
以下内容支持通用编辑器：
- AEM 6.5 LTS GA
- 支持内部部署和Adobe Managed Services (AMS)托管。
- AEM 6.5
- 支持内部部署和AMS托管。
- AEM as a Cloud Service（版本
2023.8.13099或更高版本）
本文档重点介绍对通用编辑器的AEM 6.5 LTS支持。 要将通用编辑器与AEM 6.5 LTS结合使用，您需要满足以下条件：
- AEM 6.5 LTS GA
- 正确配置 Dispatcher
设置 setup
要使用通用编辑器，请执行以下操作：
完成设置后，您即可对应用程序进行接入配置，以使用通用编辑器。
配置服务 configure-aem
Universal Editor依赖于许多必须配置的服务。
为 login-token cookie 设置 SameSite 属性。 samesite-attribute
- 打开配置管理器。
http://<host>:<port>/system/console/configMgr
- 在列表中找到 Adobe Granite 令牌身份验证处理程序，并点击更改配置值。
- 在对话框中，将 login-token cookie 的 SameSite 属性（
token.samesite.cookie.attr）值修改为Partitioned。 - 单击保存。
移除 SAMEORIGIN 标头中的 X-Frame 选项。 sameorigin
- 打开配置管理器。
http://<host>:<port>/system/console/configMgr
- 在列表中找到 Apache Sling Main Servlet，并点击编辑配置值。
- 如果存在，请从
X-Frame-Options=SAMEORIGIN附加响应标头属性（）中删除sling.additional.response.headers值。 - 单击保存。
配置Adobe Granite查询参数身份验证处理程序 query-parameter
- 打开配置管理器。
http://<host>:<port>/system/console/configMgr
- 在列表中找到 Adobe Granite 查询参数身份验证处理程序，并点击编辑配置值。
- 在 路径 字段（
path）中，添加/以启用。- 如果该字段为空，则会禁用此身份验证处理程序。
- 单击保存。
定义在通用编辑器中打开的内容路径或sling:resourceTypes paths
-
打开配置管理器。
http://<host>:<port>/system/console/configMgr
-
在列表中找到通用编辑器 URL 服务，然后点击编辑配置值。
-
定义应为哪些内容路径或
sling:resourceTypes打开通用编辑器。- 在 通用编辑器打开映射 字段中，提供通用编辑器为其打开的路径。
- 在应由通用编辑器 字段打开的:resourceTypesSling 中，输入通用编辑器直接打开的资源的列表。
-
单击保存。
-
检查您的外部化器配置，并确保至少按照以下示例设置了本地、作者和发布环境：
code language-text "local $[env:AEM_EXTERNALIZER_LOCAL;default=http://localhost:4502]", "author $[env:AEM_EXTERNALIZER_AUTHOR;default=http://localhost:4502]", "publish $[env:AEM_EXTERNALIZER_PUBLISH;default=http://localhost:4503]"
完成这些配置步骤后，AEM将按以下顺序打开页面的通用编辑器：
-
AEM检查
Universal Editor Opening Mapping下的映射，如果内容位于该处定义的任何路径下，则为其打开通用编辑器。 -
对于
Universal Editor Opening Mapping中定义的路径之外的内容，AEM检查内容resourceType是否与 Sling:resourceTypes中的条目匹配，该条目应由通用编辑器 打开。 如果匹配，AEM将在${author}${path}.html处的通用编辑器中打开该内容。 -
否则，AEM将打开页面编辑器。
在 Universal Editor Opening Mapping 中，可使用以下变量来定义映射：
path：要打开的资源的内容路径localhost：localhost的Externalizer项没有架构，例如localhost:4502author：没有架构的作者的Externalizer条目，例如localhost:4502publish：用于无架构发布的外部化器条目，例如localhost:4503preview：用于预览的外部化器项，不带架构，例如localhost:4504env：prod、stage、dev基于已定义的 Sling 运行模式token：QueryTokenAuthenticationHandler需要查询令牌
映射示例：
-
打开 AEM 作者上
/content/foo下的所有页面：/content/foo:${author}${path}.html?login-token=${token}- 打开
https://localhost:4502/content/foo/x.html?login-token=<token>的结果
-
打开远程 NextJS 服务器上
/content/bar下的所有页面，提供所有变量的信息/content/bar:nextjs.server${path}?env=${env}&author=https://${author}&publish=https://${publish}&login-token=${token}- 打开
https://nextjs.server/content/bar/x?env=prod&author=https://localhost:4502&publish=https://localhost:4503&login-token=<token>的结果
设置通用编辑器服务 set-up-ue
在更新并配置好 AEM 后，您可以为本地开发和测试搭建本地通用编辑器服务。
-
安装 Node.js 版本 >=20。
-
从Software Distribution下载并解压缩最新的通用编辑器服务
-
通过环境变量或
.env文件配置通用编辑器服务。- 有关详细信息，请参阅 AEM as a Cloud Service 通用编辑器文档。
- 请注意，如果需要重写内部 IP，可能需要使用
UES_MAPPING选项。
-
运行
universal-editor-service.cjs
更新 Dispatcher update-dispatcher
如果配置了AEM并且运行了本地Universal Editor服务，则需要在Dispatcher中允许新服务的反向代理。
-
调整创作实例的vhost文件以包含反向代理。
code language-html <IfModule mod_proxy.c> ProxyPass "/universal-editor" "http://localhost:8080" ProxyPassReverse "/universal-editor" "http://localhost:8080" </IfModule>note note NOTE 默认端口为 8080。如果在您的 .env文件中通过UES_PORT参数更改了端口值，则必须在此处相应调整。 -
重新启动 Apache。
检测您的应用程序 instrumentation
在更新 AEM 并运行本地通用编辑器服务后，您可以开始使用通用编辑器编辑 Headless 内容。
但是，必须检测应用程序以利用通用编辑器。 其中涉及包括元标记，以指示编辑器如何以及在何处保留内容。 有关此接入配置的详细信息，请参阅 AEM as a Cloud Service 的通用编辑器文档。
请注意，如果遵循AEM as a Cloud Service通用编辑器的相关文档，则在将其与AEM 6.5 LTS结合使用时将会应用以下更改。
-
元标记中的协议必须为
aem65，而不是aem。code language-html <meta name="urn:adobe:aue:system:aemconnection" content={`aem65:${getAuthorHost()}`}/> -
必须通过元标记来声明通用编辑器服务的端点。
code language-html <meta name="urn:adobe:aue:config:service" content={`${getAuthorHost()}/universal-editor`}/> -
在组件定义的
plugins部分中，必须使用aem65而不是aem。
AEM 6.5 LTS与AEM as a Cloud Service之间的差异 differences
AEM 6.5 LTS中的通用编辑器与AEM as a Cloud Service中的通用编辑器工作方式大致相同，包括UI和大部分设置。 但是，您应该注意一些差异。
- 6.5 LTS中的通用编辑器仅支持Headless用例。
- 对于6.5 LTS，通用编辑器的设置略有不同（，如当前文档中的所述）。
- 6.5 LTS中的通用编辑器使用与AEM as a Cloud Service不同的资产选取器和内容片段选取器。