是否可以使用 React 组件编写 AEM 体验片段，然后将其提供给无头前端？

Is it possible to use React components to author AEM Experience Fragments, which then feed a headless frontend?

简单描述一下我的目标--

  1. 我有一个包含约 70 个 React 组件的外部 React 组件库，它提供了一个 Web 前端（Websphere Commerce 站点，它通过 AJAX 调用获取片段 HTML 来获取体验片段） ，还有一个 React Native 应用程序。因此对于 Web，AEM 基本上是为我们的无头前端提供内容的引擎。
  2. 我想使用那些相同的 React 组件来提供 AEM Experience Fragment 创作体验，而不是必须在 AEM 中将每个 React 组件重建为 HTL 模板——维护一个完全独立的组件的开销太大HTL 模板库
  3. 通过遵循 Adob​​e 官方教程 here，我了解了如何将 React 组件映射到内容片段创作体验。我的意思是，如果我转到 AEM 主页 > 站点 >（我的站点）> 创建一个新片段，我拖入的组件由 React 模板提供。我可以判断，因为标记匹配 ui.frontend 中我的 BasicComponent.js React 模板中的内容，而不是 ui.apps.
    4. 中的 basic-component.html 模板
  4. 但是，如果我转到 AEM 主页 > 体验片段 > 创建一个新片段，相同的 BasicComponent 组件将从组件文件夹中的 basic-component.html 文件中提取（在 .content.xml)，而不是来自 BasicComponent.js

我是 AEM 的新手，所以希望上面的内容是有意义的。我知道我遗漏了一些非常基本的东西：体验片段与内容片段有何不同（如果这是正确的术语）。我花了很多时间在谷歌上搜索信息，但我发现我自己的无知让我很难确定我正在阅读的内容是否是解决我的问题的线索。

这是我用来试验的回购协议：https://github.com/drginm/aem-react-simple-example

非常感谢任何帮助！我敢肯定，我不是唯一一个正在寻找一种平易近人的模型来处理这种情况的 AEM 新手。

Experience Fragments 不建议在无头架构中与 ajax html 一起使用，它应该通过 sling 模型导出器以 json 格式公开以供反应使用。

要编辑和修改体验片段，AEM 不提供任何 API，AEM 开发人员应提供自定义 REST API 来进行更改。

我建议使用可以通过 AEM 中的资产 api 进行 CRUD 操作的内容片段。

参考资料

  1. Difference between experience fragments and content fragments
  2. ASSETS API for the Content Fragments