WordPress REST API：下一代 CMS 功能

超过四分之一的网络在 WordPress 上运行。 这是一个非常了不起的壮举，考虑到它已经存在了十多年，这使得它在科技年代相当古老。

WordPress 的秘诀是什么？ 简单——这是管理您的内容的最简单但最可扩展的方式。 然而，有一段时间，WordPress 似乎已经落后了。

随着网络越来越依赖 JavaScript 来创建身临其境的交互式体验，越来越清楚的是 WordPress 需要为用户和开发人员提供与其内容进行交互的新方式。

虽然 WordPress 建立在 - 并将继续建立在 - PHP 之上，但 WP REST API 试图在 PHP WordPress 核心的遗留问题与 JavaScript Web 应用程序的潜力和强大功能以及原生移动设备之间架起一座桥梁和桌面应用程序。

WordPress REST API 将任何 WordPress 网站的内容带入一个易于使用的 API，允许 WordPress 作为存储和检索系统，用于在网络上发布内容。

将 REST API 引入 WordPress

如果您认为 WP REST API 突然出现，那您就错了。

向 WordPress 添加全新功能并非易事。 由于本质上是开源软件，WordPress 的开发依赖于整个社区来取得进展。

几年前，API 的开发作为一个单独的功能插件开始，它允许开发人员在受控环境中试验并为项目做出贡献。

在许多迭代和增强以及两个完全独立的版本中，REST API 背后的贡献者必须测试和评估提供对数千万网站数据的开放 API 访问的好处和巨大后果。

WordPress 4.4，代号“Clifford”，将项目的初始基础设施带入了 WordPress 核心，而端点直到 WordPress 4.7，“Vaughan”才出现。

从本质上讲，这让开发人员有时间测试支持 API 的功能，而无需实际暴露数据本身。

现在初始内容端点已合并到所有当前版本的 WordPress，插件开发人员和主题作者可以尝试令人兴奋的新方法来检索、查看和更改传统 wp-admin 体验之外的数据。

分解缩写：从 HTTP 到 JSON REST API

要了解 WP REST API 的重要性，了解我们如何在线共享数据的基础以及 Internet 的发展方向可能会有所帮助。

HTTP 是我们日常处理的大多数网络流量的基础。 如果你在浏览器中输入一个 URL，你就是在发出一个请求。 相应的服务器接收您的请求并提供响应。 这笔交易几乎是我们在网上所做的一切的基础。 浏览器发出请求，服务器提供响应。

我们发出的请求类型会影响我们得到的响应类型。 大多数时候，我们发出一个简单的GET请求：“嘿 Google，把你的着陆页给我。” 谷歌提供了回应。

随着网络变得更具交互性，我们开始利用其他 HTTP 请求，包括PUT 、 POST和DELETE 。

例如，我们在网站上填写搜索栏：“嘿 Google，将我的电子邮件地址和密码发布到您的登录页面。” Google 为我们开始新的会话并提供不同的响应。

该协议是我们构建 WordPress 网站的基础。

我们使用表单和 PHP 将数据 GET 和 POST 到我们的数据库中。 与流行的观点相反，WordPress 的这个基础不会很快改变。 WordPress 现在所做的就是为开发人员提供一种通过 RESTful API 与 WordPress 数据交互的新方法。

具象状态转移 (REST)

WordPress 开发人员通常应该熟悉 API，例如 Shortcode API 和 Options API。 这些 API 定义了组成 WordPress 的组件的功能，因此主题和插件作者可以扩展 WordPress 的核心功能。 然而，WP REST API 有点不同。

REST或 RESTful API 是关于将您的数据安全地暴露给来自外部源的 HTTP 请求。 它还涉及建立一个通用架构和一组协议来响应这些请求。 虽然此类服务背后有更先进的想法和原则，但这些超出了本文的范围。

WP REST API 的存在，特别是在 WordPress 4.7 之后，意味着您网站的所有内容，包括帖子、页面、评论和任何公共帖子元数据，现在都可以作为原始数据直接访问。 这也意味着您可以根据需要从传统的 wp-admin 之外更改此数据，可能通过移动或桌面应用程序。

您现在可以以 JSON 的形式对数据进行序列化访问，而不是将您的数据简单地视为数据库中的行。

JSON - XML 发生了什么？

WordPress 专家对 XML 有着丰富的经验，XML 是一种在站点之间共享内容的常用格式。

与 XML 类似，JSON 只是一种机制，它允许我们通过将数据绑定到特定的语法来轻松地传输数据。 JSON 实际上是一个字符串，一个 JavaScript 对象的文本表示，将您的数据存储在一组键值对中。 WordPress 帖子的常见 JSON 表示形式可能如下所示：

 { “id”: 1, “title”: { “rendered”: “Hello World” }, “content”: { “rendered”: “Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!” } }

（如有必要，您可以使用 JSON 格式化工具来美化 JSON 响应。）

通过 WP REST API 的完整 JSON 响应将包含有关帖子的其他信息，包括元数据。 通过方便地将这些数据捆绑成 JSON 格式，您可以以令人兴奋的新方式与您的 WordPress 内容进行交互。

JSON 最适合与 JavaScript 配对并非巧合。 随着越来越多的 WordPress 开发人员开始“深入学习 JavaScript”，我们将看到越来越多的 WordPress 作为后端的高级用途。

我们如何查找数据：按照路线到达端点

通过 REST API 访问所有站点数据就像编写 URL 一样简单。

对于至少运行 4.7 版的任何 WordPress 站点，将以下字符串添加到站点 url 的末尾： /wp-json/wp/v2 （例如， http://example.com/wp-json/wp/v2 ://example.com/wp-json/wp/v2）。 将该 URL 放入浏览器中，看看会出现什么情况。

结果可能看起来像一大堆数据，除非你安装了一个清理 JSON 的浏览器扩展。 大量数据是您的特定 WordPress 网站的 JSON 格式的内容和元信息。

通过加载该内容，您刚刚定义了一个路由并要求您的浏览器为您获取它。

路由是映射到特定方法的 URL。 WordPress 核心读取该路由，每个斜杠“/”代表应遵循的特定路径或参数。

该路径在端点处结束，WordPress 核心内部的函数可以决定提供哪些数据以及如何处理所提供的任何数据。

一个示例端点可能是“/wp-json/wp/v2/posts/1”，我们在其中添加了路径“/posts”和“/1”。 这个特定的端点告诉我们的站点检查我们的数据，拉起我们的帖子，并拉起 ID 为 1 的帖子。

REST API 如此有用的原因在于它是可扩展的，这意味着您可以获取网站内的任何数据，并将其添加为端点。 目前（或很快将）支持大多数核心 WordPress 功能。

但是，主题和插件开发人员可以开始将他们的自定义内容和设置添加为端点，从而允许用户以新的方式与他们的网站进行交互。

如果您对 WordPress 站点上当前可用的端点感到好奇，像 Postman 这样的浏览器应用程序提供了一个专门用于探索 API 的 GUI。

标头和身份验证

在浏览器中键入 URL 端点看起来很简单，但它实际上包括一组默认标头以及请求。 反过来，一组标头也与响应一起发回。 这些标头包含许多有用的信息，但对我们而言最重要的信息与我们发出的请求类型以及我们是否经过身份验证有关。

如果您跳入浏览器的“开发人员工具”，您可以检查加载到浏览器窗口中的任何资产的 HTTP 标头，包括 HTML 文件、CSS 样式表、图像等。

第一个要考虑的标头是Request Method ，它直接对应于我们之前了解的那些 HTTP 请求。 如果我们只是查看一个页面，您很可能会在这里看到GET作为请求方法。

调用 REST API 的应用程序可能会选择将标头的请求方法更改为 POST。

POST 方法告诉您的网站在 WordPress 数据库中输入新数据或更改现有数据。 通过 POST 方法发送信息，其他应用程序可以更改您的数据，而无需登录 wp-admin。

但是，无需担心，因为除非它们还包含为身份验证提供正确凭据的标头，否则您的网站将拒绝它们。

注意：但是，对 REST API 的调用进行身份验证的方法仍未最终确定，这使得身份验证成为想要使用 REST API 添加或更改数据的开发人员进入的最大障碍。

目前，有一些可用的选项，包括来自 REST API 背后的开发人员的插件。 随着围绕身份验证的标准程序进入核心，最后的障碍将清楚地用于广泛使用 WP REST API。

WP REST API 示例应用程序

WP REST API 如此强大的原因在于它是一致的，因此我们可以期望任何运行 WordPress 4.7 或更高版本的站点都能获得相同的基本结果。 但是，WordPress 是一种分布式 API，这意味着不仅可以从一个地方获取所有数据。

每个运行 WordPress 的网站都是一个独特的应用程序，具有独特的用户和身份验证。 虽然通过 REST API 编辑内容可能需要不同的授权技术，但我们实际上可以很容易地访问大多数 WordPress 运行的博客的帖子。

为了演示，我们将制作一个快速的 codepen 演示，加载一些流行的 WordPress 相关博客的最新帖子的摘录，当然，这些博客都在 WordPress 上运行。 在此过程中，我们将包含一个搜索表单，因此我们实际上可以一次搜索所有这些站点，并从每个站点中提取相关文章。

最后，我们一定会在原始网站上包含阅读全文的链接。

阶段 1：获取最近的帖子

我们将首先设置一个快速的 Vue 实例并将其安装到一个元素上。 我们还将包括 Bootstrap，以便我们可以在稍后添加的表单元素上设置网格和基本样式。

当我们定义数据时，我们需要一个地方来存储站点的名称（默认响应中不包含）、URL 和我们得到的帖子。 这是一个例子：

 { “name”: “wordpress.org”, “url”: “https://wordpress.org/news/wp-json/wp/v2/posts?per_page=3”, “posts”: [] }

您会注意到，我们还将第一个参数包含在 URL 的末尾per_page中。 通常，WP REST API 将按照与对普通 WP_Query 循环进行分页相同的规则对结果进行分页。 我们将把查询限制在前三个帖子中。

接下来，我们将定义方法loadPosts() ，它将遍历我们的源列表，使用 vue-resource 获取结果，并使用结果填充每个源的空posts数组。

 loadPosts : function(){ var self = this; self.sources.forEach(function(source, index){ self.$delete(source, 'posts'); // Get API with vue-resource self.$http.get(source.url).then(function(response) { self.$set(source, 'posts', response.data); }, function(response) { console.log('Error'); }); }); }

当我们的 Vue 实例成功挂载时，我们还将包含对loadPosts()的初始调用。

 mounted : function(){ this.$nextTick(function(){ // Load posts on initial page load this.loadPosts(); }); }

将来我们开始对 API 进行多次调用时，将loadPosts()保留为单独的方法将派上用场。 在我们的 HTML 中，我们将使用 Vue 的简单列表渲染指令和模板语法来输出我们所有的帖子。

有关工作演示，请参阅嵌入式 Pen：

请参阅 CodePen 上 Brian Coords (@bacoords) 的 Pen WP REST API 搜索示例（第一阶段）。

第 2 阶段：过滤结果

让我们添加一个侧边栏，并创建一些过滤器来显示/隐藏各种来源。 为此，我们向sources对象添加一个新属性，一个我们将命名为的布尔值。

当我们添加过滤器时，让我们生成一个 Vue 过滤器来帮助我们正确显示日期。 WordPress 将帖子的日期和时间存储为 Unix 时间戳。

我们将使用第三方库 Moment.js 将日期转换为更易读的格式。

 filters: { // Using Moment.js to convert post date to a readable format prettyDate: function(value){ // Return if date is empty if(!value) return ''; // Convert date to Moment.js var date = moment.utc(value); // Return formatted date return date.format("MMM DD, YYYY,"); } },

有关工作演示，请参阅嵌入式笔：

请参阅 CodePen 上 Brian Coords (@bacoords) 的 Pen WP REST API 搜索示例（第一阶段）。

最后阶段：搜索查询

在这里，我们将向我们的 API 请求添加一个新参数。 我们已经添加了per_page=3参数来限制我们从每个站点获得的结果数量。 如果搜索栏中有任何内容，我们会将其作为附加参数添加。

这将允许我们使用每个站点的内置搜索功能，就像我们查询该网站上的搜索栏一样。

我们将添加一个搜索栏，并使用 Vue 的v-model指令将其绑定到一个变量。

当用户开始输入时，我们将添加一个按钮并将一个事件绑定到表单提交，而不是立即调用所有 API。 然后我们将向我们的 Vue 实例添加一个方法，该方法将搜索参数（当然是 URL 编码）添加到 URL。

 generateUrl : function(source){ var self = this; // Add search parameters. if(self.searchQuery){ return source.url + '&search=' + encodeURI(self.searchQuery); }else{ return source.url; } }

有关工作演示，请参阅嵌入式笔：

请参阅 CodePen 上 Brian Coords (@bacoords) 的 Pen WP REST API 搜索示例（第一阶段）。

虽然这是 WP REST API 的一个简单示例，但我们可以想象在 WordPress 本身中有一个类似这样的潜在应用程序。 例如，已经有“WordPress 新闻”元框。

我们可以轻松地将这个演示转换为 WordPress 插件，将其显示在 WordPress 仪表板上。 现在，我们已经集成了直接从我们自己的网站从一些顶级 WordPress 和网页设计教程网站搜索帮助的功能。

REST API 的未来潜力

尽管上面的示例仅触及了 WP REST API 功能的表面，但它应该传达了当您开始使用数据时开始出现的一些可能性。 无论是用于增强网站本身的用户体验，还是从外部来源收集和操作数据，它都是一个强大的工具。

尽管一些行业专家对将您的内容“抓取”并显示在其他地方的可能性表示担忧，但重要的是要记住，此功能类似于 RSS 提要，并且对于网站维护者来说，清楚地控制数据是什么和是什么是至关重要的不公开。

随着 WP REST API 在 WordPress 结构中变得更加根深蒂固，我们将开始看到它的效果，甚至可能没有意识到。 示例范围从简单（Chris Coyier 的设计引述）到复杂的单页应用程序（Guggenheim 网站）。

WP REST API 的另一个流行用例是移动应用程序开发。

由于内容可以通过 REST API 访问，因此开发人员可以为 iOS 和 Android 创建本机应用程序，而不必创建重复的数据源。

当用户与这些移动应用程序交互时，他们将能够检索并直接转换原始网站的数据，而无需开发人员创建任何复杂的基础设施来支持这一点。

然而，这些面向访问者的 REST API 应用程序只是一个开始，因为真正的影响要深得多。 核心开发团队的目标之一是开始在整个 wp-admin 界面中使用它。

随着未来的 WordPress 更新，我们将开始看到 admin-ajax 被 API 取代，有望提高基本功能的速度，例如编辑菜单或发布帖子。

这可能与 WordPress 越来越关注定制器和编辑器作为 WordPress 新手的用户友好起点密切相关。

虽然 WP REST API 非常有用，但还有更多工作要做。 API 不完整。 还有更多功能和端点要添加。

最终，您甚至无需访问即可与您的 WordPress 网站进行交互。 虽然现在许多服务使用自定义 API 与 WordPress 交互，但转向一个标准的 WordPress REST API 意味着更多的站点和服务可以互连，使用相同的语言。

WordPress 最初是作为博客平台开始的，它是博主联系并分享他们的想法和想法的一种方式。 随着 WordPress REST API 的开发，我们将开始在幕后看到新的连接和共享水平。 这将允许用户以以前从未考虑过的方式建立他们的想法和想法，将 WordPress 及其用户带到全新的领域。