内容管理系统（Content Management System，CMS）是一种用于管理、发布、修改和删除内容的软件系统。传统 CMS 通常是一体化的解决方案，包括前台展示、后台管理和数据库。然而，随着 Web 应用和移动应用的组合和发展，CMS 的用法和方式发生了转变。
Headless CMS 是一种新型 CMS 模式，它分离了后台管理和前台展示。Headless CMS 提供了 API 接口，让开发者可以通过数据获取和操作来掌控前端内容展示。Headless CMS 的出现弥补了传统 CMS 的缺陷，使得 CMS 更加适用于现代化的 Web 和 App 应用。
在开源 CMS 平台中，Headless CMS 的应用也越来越普遍。下面将会介绍 WordPress 和 Strapi 两种开源 CMS 平台中 Headless CMS 的应用方式及技术实现。
WordPress 的 Headless CMS 应用
WordPress 是一款流行的开源 CMS 系统，它最初是为固定式网站开发而设计的，但是通过插件和主题可以实现主流 CMS 功能。而在 Headless CMS 方面，WordPress 可以通过插件实现 REST API，并提供了基于 JSON 格式的数据传输，开发者可以根据 API 设计自己的前端展示逻辑。
下面就是一个通过 WordPress REST API 接口获取文章标题列表的代码示例：
-- -------------------- ---- -------
-- -----
----- ------- - --- ---------
--------------- ------------------
---
-- ------
----- ------- - -
------- ------
-------- --------
----- -------
------ ---------
--
-- ------
----- ------- - --- ---------------------------------------------------------- ---------
-- ----------
--------------
---------------- -- ----------------
------------ -- -
----- ------ - ------------- -- ---------------------
--------------------
---通过上述代码，我们成功从 WordPress 的 Headless CMS 接口中获取了文章标题列表，并将其输出到控制台。
除了 WordPress REST API，开发者还可以利用现成的 Headless CMS 插件，如 WPGraphQL 或者 WP REST API Controller，来优化和扩展 WordPress 的 Headless CMS 功能。
Strapi 的 Headless CMS 应用
Strapi 是一个基于 Node.js 的现代化开源 CMS 解决方案。它提供了开箱即用的 Headless CMS 功能，可以轻松地搭建和管理 API，为前端工程师提供易用的数据获取和管理方式。
在 Strapi 中，用户可以定义 API 的数据模型，包括字段、关联关系和数据验证等。用户也可以配置访问授权、API 版本以及上传下载管理等。
下面是一个 Strapi 的 CRUD 操作示例：
-- -------------------- ---- ------- ----- ----- - ------------------------- ----- ------- - ------------------------ ----- ----------- - - -------------- - ------------------ -- ----- --------- - - ---------------- ------- ----------- -- -- ------ - --- ---- ------------------------------ - ----- ---- ----- -- - -------- -------------------------- ---------- -------------- -- -------------------------- -- --- --- ----- ----------------------------- - -------- --------- -- ------------ -- -------------------------- -- --- -- ---- ---- -------- -- ------------------------------- - -------- --------- -- ------------ -- -------------------------- -- ------ -- ---- ---- -------- -- ------------------------------- - ----- -------- ----- -- - -------- -------------------------- ---------- -------------- -- -------------------------- -- ------ -- ---- ---- -------- -- ---------------------------------- - -------- --------- -- ------------ -- --------------------------
上述代码演示了如何利用 axios 库进行 Strapi 数据的增删改查操作，并加入了访问权限控制。
总结
Headless CMS 通过分离前端和后端，提供了更灵活的 CMS 解决方案。在开源 CMS 平台中， WordPress 和 Strapi 都提供了丰富的 Headless CMS 功能和支持，并且可根据不同的前端需求进行扩展和定制。希望本文可以帮助开发者更好地使用 Headless CMS，在创建现代化 Web 应用的道路上取得成功。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6594a707eb4cecbf2d8f615a