标签: WordPress API

  • 如何使用Vue创建无头WordPress网站

    了解如何使用Vue创建无头WordPress网站

    WordPress一直是开发者和非开发者快速构建和创建惊人网站的内容管理系统。

    使用内容管理后端与前端分离的微服务体系结构,可以最大限度地控制两个“端”。这种分离问题正是无头内容管理系统(包括无头WordPress解决方案)试图解决的问题。

    通过无头方法,企业可以对内容管理后端进行更精细的控制。他们还可以自由使用自己选择的任何前端,包括React、Vue、Angular等。

    本指南将详细探讨无头WordPress,以及它的全部内容、何时以及为什么应该考虑使用它。最后,我们将探索创建无头WordPress环境,使用Vue.js构建前端,并部署无头WordPress。

    1. 什么是无头WordPress
    2. 无头WordPress的利弊
    3. 何时无头WordPress可能不是最好的选择
    4. 谁应该使用无头WordPress
    5. 谁应该避免使用无头WordPress
    6. 如何搭建无头WordPress(构建应用程序)

    什么是无头WordPress

    WordPress是一个整体式应用程序,后端和前端部分紧密地缠绕在一起。后端是进行管理的地方,在这里您可以创建、编辑、添加和删除内容,包括更改外观配置。相反,前端负责向用户显示内容。

    无头WordPress是用来描述解耦WordPress的术语。后台(管理)部分与WordPress CMS的前端部分是分开的。您可以使用您选择的任何前端框架作为独立应用程序开发和管理前端。

    无头WordPress的利弊

    接下来,我们将探讨无头WordPress的优缺点,让您更好地理解这个概念。

    优点

    (1)超高速性能-在这个应用程序运行速度极快的时代,您的网站加载时间不应超过几秒钟,以免失去访问者。由于前端与WordPress分离,并且可以使用现代前端工具开发高性能和可扩展性,因此采用无头WordPress方法对网站的整体用户体验非常有益。

    (2)粒度控制-选择无头架构可以让您更好地控制设计布局、内容展示以及用户与应用程序前端的交互方式。它还允许从中心位置保护和访问后端内容。

    (3)增强的可扩展性-扩展WordPress有时可能会很复杂,因为您无法完全控制驱动WordPress的所有组件和代码,主要是在您不是开发人员的情况下。但是通过WordPress的解耦,可以轻松地单独缩放每个部分,并且您可以轻松地检测出需要缩放的部分。

    (4)更严密的安全-我们无法充分强调无头WordPress的安全优势,因为解耦WordPress在抵御黑客和DDoS攻击方面具有很高的安全优势。无头WordPress方法使得黑客很难访问您的敏感后端数据,因为它与您的前端(面向用户的网站)是分开的。

    (5)轻量化设计-您将可以更好地控制前端设计的结构和布局。此外,您还可以在前端进行更自由的定制设计;由于RESTAPI调用,您将能够利用现代web工具并在前端部署它们。

    (6)多渠道内容发布-由于无头WordPress使用基于API的系统将您的内容传送到前端,因此您可以在任何位置和任何平台上显示您的内容,包括桌面、网站、移动应用程序和触摸屏信息亭。还可以充分利用增强现实、虚拟现实和物联网设备来显示和呈现来自基于API的系统的内容。

    缺点

    我们将更深入地探讨无头的缺点,但其主要缺点是:

    1. 在管理不同的网站实例时,分离后端和前端会给您带来额外的负载。
    2. 由于它需要团队中的额外成员和运行不同实例的额外资金,因此实施起来可能会很昂贵。
    3. 如果内容在所有平台上呈现不一致,则在不同平台上提供内容可能会导致用户体验不一致。

    何时无头WordPress可能不是最好的选择

    由于无头WordPress是一项具有巨大优势的难以置信的创新,因此在决定是否使用它时,您需要记住一些事情。

    • 无头WordPress的维护费用非常昂贵。从基础设施到多个开发人员,您将维护一个网站的两个不同实例。
    • 无头WordPress不支持WordPress的所有功能。例如,WordPress的强大功能,如所见即所得编辑器和live preview,在使用单独的前端时无法工作。
    • 设置无头WordPress的成本更高。因此,始终牢记其增加的成本。

    谁应该使用无头WordPress

    以下是您可能需要无头WordPress的最佳情况:

    1. 如果你的网站的安全性是你最关心的,也是对你的公司最重要的,那么你应该使用无头WordPress。
    2. 接下来,如果您的网站不需要定期升级和更新,这将是一个很好的迹象,表明您需要使用无头设置。
    3. 接下来,如果你想有一个WordPress主题不容易实现的定制设计,你需要用一个独特的设计来增加网站前端的趣味。那么,无头WordPress是你的下一个选择。
    4. 最后,如果你正在为演示和教程建立一个寿命很短的网站或演示网站,那么你可以尝试无头方法。

    谁应该避免使用无头WordPress

    以下几种情况下,使用无头WordPress不是一个好的选择:

    1. 当你的网站仅仅依赖于特定的插件和功能来控制应用程序的前端并与之协同工作时,你应该坚持使用WordPress,除非插件提供基于API的选项来使用数据。
    2. 假设您对编写网站代码不感兴趣,或者您的网站需要日常维护,并且由于预算较低,您没有雇佣专业人员进行日常维护。在这种情况下,WordPress是一个适合您的选项。
    3. 如果你不是一个经验丰富的开发人员,想单独创建和管理你的网站,你应该使用WordPress。

    如何搭建无头WordPress(构建应用程序)

    本节将探讨如何构建和开发一个新闻博客,其后端为无头WordPress,前端为Vue 3。

    使用Devkinsta设置无头WordPress

    我们将使用DevKinsta开发无头WordPress,DevKinsta是一个流行的WordPress本地开发环境,用于设计、开发和部署WordPress站点,使您的本地机器舒适。

    DevKinsta是永远免费的,它为您开发和构建WordPress提供了巨大的好处和舒适。

    您可以从官方网站下载并安装DevKinsta,并按照文档中的说明开始。

    由于我们已经安装了DevKinsta,我们将打开它并按照下面的步骤设置我们的第一个无头WordPress。

    在DevKinsta仪表板上,使用Nginx、MySQL和任何可用的WordPress版本创建一个新的WordPress站点。此外,您还可以从仪表板导入现有WordPress实例或创建自定义WordPress实例。

    接下来,为新创建的WordPress实例提供一个名称、管理员用户名和密码,然后单击Create并复制详细信息,同时DevKinsta在本地计算机中创建一个新的WordPress实例。

    接下来,单击“Open Site”,在默认浏览器上打开新创建的WordPress实例。

    最后,您可以通过访问 http://headless-wordpress-news-blog.local/wp-admin 链接并键入创建新实例时输入的管理员登录凭据。

    注意,我们已经在本地主机 http://news-blog.local使用URL  http://headless-wordpress-news-blog.local 设置了无头WordPress,我们将在整个教程中使用它。

    配置我们的无头WordPress

    接下来,在成功登录到WordPress仪表板之后,您可以继续安装您选择的任何插件和配置。

    我们将在本教程中完全禁用该主题,通过安装简单的网站重定向插件并进行设置,仅通过基于WordPress REST API的端点访问内容。

    转到Plugins > 安装插件并搜索Simple Website Redirect,安装并启用:

    WordPress插件安装

    WordPress插件安装

    接下来,单击插件Settings并输入基于前端的URL (e.g. http://news-blog.local),,单击Advanced setting options并将以下路径 — /wp-admin/wp-login.php/wp-json 添加到Exclude Paths。

    最后,通过在Redirect Status下拉列表中选择Enabled 来启用插件:

    Simple Website Redirect插件设置

    Simple Website Redirect插件设置

    此外,如果在默认情况下访问 http://headless-wordpress-news-blog.local/wp-json 时未启用JSON API,您可以通过在WordPress设置下打开固定链接并选择文章名Post Name或您选择的任何其他选项来启用该功能(但朴素Plain除外):

    WordPress固定链接

    WordPress固定链接

    现在当你访问你的http://headless-wordpress-news-blog.local/wp-json,它应该向您提供JSON数据,如下所示:

    {
    “name”: “Headless WordPress News Blog”,
    “description”: “Just another WordPress site”,
    “url”: “http://headless-wordpress-news-blog.local”,
    “home”: “http://headless-wordpress-news-blog.local”,
    “gmt_offset”: “0”,
    “timezone_string”: “”,
    “namespaces”: [
    “oembed/1.0”,
    “wp/v2”,
    “wp-site-health/v1”
    ],
    “authentication”: [
    ],
    “routes”: {
    “/”: {
    “namespace”: “”,
    “methods”: [
    “GET”
    ],
    “endpoints”: [
    {
    “methods”: [
    “GET”
    ],
    “args”: {
    “context”: {
    “default”: “view”,
    “required”: false
    }
    }
    }
    ],
    {
    “name”: “Headless WordPress News Blog”,
    “description”: “Just another WordPress site”,
    “url”: “http://headless-wordpress-news-blog.local”,
    “home”: “http://headless-wordpress-news-blog.local”,
    “gmt_offset”: “0”,
    “timezone_string”: “”,
    “namespaces”: [
    “oembed/1.0”,
    “wp/v2”,
    “wp-site-health/v1”
    ],
    “authentication”: [

    ],
    “routes”: {
    “/”: {
    “namespace”: “”,
    “methods”: [
    “GET”
    ],
    “endpoints”: [
    {
    “methods”: [
    “GET”
    ],
    “args”: {
    “context”: {
    “default”: “view”,
    “required”: false
    }
    }
    }
    ],

    {
      "name": "Headless WordPress News Blog",
      "description": "Just another WordPress site",
      "url": "http://headless-wordpress-news-blog.local",
      "home": "http://headless-wordpress-news-blog.local",
      "gmt_offset": "0",
      "timezone_string": "",
      "namespaces": [
        "oembed/1.0",
        "wp/v2",
        "wp-site-health/v1"
      ],
      "authentication": [
        
      ],
      "routes": {
        "/": {
          "namespace": "",
          "methods": [
            "GET"
          ],
          "endpoints": [
            {
              "methods": [
                "GET"
              ],
              "args": {
                "context": {
                  "default": "view",
                  "required": false
                }
              }
            }
          ],
    ...

    设置Vue.js(前端)

    我们将使用Vite web开发工具创建Vue 3应用程序,以连接无头WordPress。您可以阅读有关Vue 3Vite开发工具的更多信息。

    在本文中,我们将构建一个新闻博客。该项目的所有后端内容管理都将使用Devkinsta由我们的无头WordPress开发和托管。

    键入以下简单命令:

    npm init @vitejs/app news-blog
    cd news-blog
    npm install
    npm run dev
    npm init @vitejs/app news-blog
    cd news-blog
    npm install
    npm run dev
    npm init @vitejs/app news-blog
    cd news-blog
    npm install
    npm run dev

    如果您的用户名中存在空格问题,请尝试使用:

    npx create-vite-app news-blog
    npx create-vite-app news-blog
    npx create-vite-app news-blog

    最后,使用您选择的任何代码编辑器打开Vue 3代码库。我们将使用VSCode,下面让我们继续努力码字。

    使用WordPress API

    我们已经着手开发Vue应用程序的其余部分,以节省您的阅读时间,但您可以继续从我的GitHub克隆存储库

    显示文章列表组成部分

    下面的代码片段显示了我们如何使用Vue实例实现WordPress REST API,以显示来自无头WordPress的所有文章:

    <template>
    <section>
    <div class=“padding-top”>
    <div class=“container inner-padding-top”>
    <div class=“row”>
    <div class=“col-md-12 col-sm-12-col-xs-12 text-center”>
    <h2 class=“lead-title text-uppercase”>
    Latest Backend Dev. Articles
    </h2>
    <h3 class=“article-subtitle”>
    Latest Backend Dev. Articles curated daily by the community.
    </h3>
    </div>
    </div>
    <div class=“row mb-1 mt-5”>
    <post v-for=“(post, i) in posts” :key=“i” :post=“post” />
    </div>
    </div>
    </div>
    <div class=“col-md-12 col-sm-12-col-xs-12 text-center mb-5”>
    <Button link=“/posts” class=“col p-3”>More Articles</Button>
    </div>
    </section>
    </template>
    <script>
    import { mapState } from ‘vuex’
    export default {
    computed: {
    mapState({
    posts: (state) => {
    return […state.post.posts].slice(0, 22)
    },
    }),
    },
    }
    </script>
    <template>
    <section>
    <div class=”padding-top”>
    <div class=”container inner-padding-top”>
    <div class=”row”>
    <div class=”col-md-12 col-sm-12-col-xs-12 text-center”>
    <h2 class=”lead-title text-uppercase”>
    Latest Backend Dev. Articles
    </h2>
    <h3 class=”article-subtitle”>
    Latest Backend Dev. Articles curated daily by the community.
    </h3>
    </div>
    </div>
    <div class=”row mb-1 mt-5″>
    <post v-for=”(post, i) in posts” :key=”i” :post=”post” />
    </div>
    </div>
    </div>
    <div class=”col-md-12 col-sm-12-col-xs-12 text-center mb-5″>
    <Button link=”/posts” class=”col p-3″>More Articles</Button>
    </div>
    </section>
    </template>

    <script>
    import { mapState } from ‘vuex’
    export default {
    computed: {
    …mapState({
    posts: (state) => {
    return […state.post.posts].slice(0, 22)
    },
    }),
    },
    }
    </script>

  • WordPress REST API入门基础知识点

    WordPress REST API入门基础知识点

    WordPress REST API正在改变WordPress。您可能没有注意到,因为其中很多都在幕后,但是REST API的含义对WordPress的未来产生了巨大的影响,无论是在代码库还是使用方面。

    如果您没有使用过WordPress REST API,您可能想知道它是什么。因此,让我们先看看REST API是什么。

    在本文中,我们讲解WordPress REST API的一些基础知识。我们将研究它的作用、工作原理以及它给平台带来的变化。最后,我们将讨论您可以用它做的一些事情。

    当REST API最终被添加到WordPress的核心时,漫长的旅程就结束了。许多人预计这一变化是该平台历史上WordPress向前迈出的最大一步。但是,如果您不熟悉REST API,您可能会对它所获得的所有关注感到困惑。

    简而言之,WordPress REST API的加入使WordPress变成了一个功能齐全的应用程序框架。这显着提高了它的“可扩展性”,或者说它可以通过新特性和功能进行扩展。此外,它还扩展了平台与其他站点和应用程序进行通信的潜力。

    1. 什么是WordPress REST API?
    2. 了解WordPress REST API
    3. 如何访问WordPress REST API
    4. WordPress REST API命令概述
    5. 何时不使用WordPress REST API
    6. 使用WordPress REST API的实际应用程序

    什么是WordPress REST API?

    在我们深入研究WordPress REST API之前,了解我们的术语很重要。这是一个我们需要使用大量首字母缩略词的主题,所以让我们先把它们弄清楚。

    什么是应用程序编程接口 (API)?

    首先,您需要知道什么是应用程序编程接口 (API)。用最简单的术语来说,API是一个系统使其他系统能够连接到其数据的一种方式。例如,当网站向页面添加Facebook的“Like”按钮时,它会通过连接到Facebook的API来实现这一点。这让网页可以使用API来接收数据(点赞按钮的代码)和发送数据(点赞请求)。

    应用程序编程接口或API被定义为:

    “客户端和服务器之间的接口或通信协议,旨在简化客户端软件的构建。”

    如果您不熟悉API,那可能没有多大帮助。更简单地说,API是一组允许一个系统与另一个系统交互(或“接口”)的代码。如果您曾经将Google地图添加到您的WordPress站点,那么您就使用了Google的Maps API,它允许您的WordPress站点与Google Maps交互。

    这些系统不需要完全分开。WordPress已经有多个API,用于插件、设置和短代码等。插件和主题开发人员可以使用这些来与WordPress核心进行交互并使事情发生(例如创建短代码和向WordPress管理员添加设置屏幕)。

    与REST API的不同之处在于它允许WordPress安装本身之外的系统与WordPress交互,这就是REST部分的用武之地。

    什么是具象状态转移 (REST)?

    那么,REST API究竟是什么?具象状态传输 (REST)是一种特定于Web服务的 API。它包含一组标准化的指令和规则,使所有“RESTful”服务更容易相互连接。

    简而言之,REST API使您能够向外部系统发出请求。这方面的一个例子是Twitter。您可以使用其API向特定用户请求一定数量的推文。然后API将根据您的请求返回推文,您可以使用HTML和CSS将其嵌入您的网站。

    这些请求是使用JavaScript Object Notation (JSON) 执行的。这是一种专为发送、接收和存储数据而设计的语言。我们将在本文后面介绍JSON,但我们建议您先花点时间熟悉一下这种语言。这将帮助您准备好使用WordPress REST API,并理解我们将要讨论的一些概念。

    WordPress REST API是一个接口,开发人员可以使用它从WordPress安装本身之外访问WordPress。您可以使用JavaScript访问它,这意味着它可用于创建交互式网站和应用程序。

    REST代表 Representational State Transfer,API 代表应用程序编程接口。让我们来看看每一个的含义。

    Representational State Transfer (REST) 提供了 Web 系统可以用来相互交互的标准。如果没有 REST,两个系统将无法相互理解,从而来回发送数据。

    要使应用程序成为RESTful,它必须符合五个原则:

    1. 统一界面。用于访问系统中资源的URL必须是统一的、一致的,并且可以通过常见的方法(例如GET)(稍后会介绍更多)进行访问。
    2. 客户端服务器。客户端应用程序和服务器应用程序必须是分开的,因此它们可以相互独立开发。如果服务器端技术(即 WordPress)发生变化,服务器端应用程序(例如一个应用程序)必须仍然能够通过相同的简单方法访问它。
    3. 无国籍。使用API发出新请求时,服务器不会更改状态。它不存储已发出的请求。
    4. 可缓存。所有资源都必须是可缓存的,以提高速度并符合Web标准。缓存可以在服务器端或客户端实现。
    5. 分层系统。RESTful系统允许您使用多个层来访问它,如果需要,将数据存储在中间服务器中。服务器无法判断最终客户端是否直接连接到它。

    所有这些约束都与网页和应用程序相关,并控制应用程序与API交互的方式。

    这对WordPress意味着什么?

    将REST和API放在一起意味着WordPress REST API是一组代码,旨在使其他系统能够与WordPress交互,并且它的构建方式可确保这些系统能够相互理解。

    这意味着第三方网站或移动应用程序,例如,可以访问您的WordPress数据库,从中获取数据并向其中添加数据。

    不过,这有许多含义和用途。

    了解WordPress REST API

    WordPress REST API

    WordPress REST API的功能与我们已经提到的例子大体相同。基本上,WordPress REST API使您可以从任何与JSON兼容的框架中访问WordPress的所有功能。

    与Twitter的API使您能够检索和发送推文的方式类似,WordPress REST API可用于管理来自外部平台的文章、用户、类别等。这使您能够以多种前所未有的方式使用WordPress。

    WordPress REST API的背景

    REST API早在2013年就宣布了,它以插件的形式开始,旨在通过4.1版将其合并到WordPress核心中。正如经常发生的那样,延迟会推迟发布,直到三年后随着WordPress 4.7的发布,它最终被实现到核心中。

    WordPress REST API于2016年12月作为4.7版核心的一部分发布,但在此之前它作为插件存在。

    对于许多人来说,这是一个漫长但值得的等待,他们将WordPress REST API视为平台向前迈出的重要一步。您可能想知道为什么这个添加如此重要,特别是因为很多用户可能没有注意到太大的区别。事实证明,出于多种原因,包含REST API是对WordPress的根本性更改。

    例如,通过实施REST API,WordPress从简单的创建网站的平台迈出了一步。相反,它现在已经成为一个成熟的应用程序框架。这意味着开发人员可以使用WordPress站点为移动设备和网络创建应用程序,或作为信息存储库。

    这种转变也使WordPress摆脱了对PHP的依赖。通过使WordPress与任何JSON-compatible语言兼容,REST API极大地扩展了开发人员的可能性,使他们能够将WordPress功能与几乎任何框架一起使用。

    它旨在支持一系列基于WordPress构建的应用程序,并将WordPress从内容管理系统转变为应用程序平台。

    它被WordPress.com广泛使用,其基于JavaScript的界面使用REST API与WordPress数据库进行交互。古腾堡编辑界面也使用它,该界面在2019年成为核心的一部分。

    REST API扩大了WordPress可用于的应用程序范围。虽然内容管理系统擅长运行复杂的网站,但应用程序平台也可用于支持基于Web的单页应用程序或SPA(如果您曾经使用过Google文档,那么您已经使用过其中之一)。

    在这些中,当用户执行操作时会刷新内容,而不是加载新页面。因为它使用JavaScript(一种客户端语言)而不是PHP(一种服务器端语言),所以它可以在用户的​​浏览器中进行操作,而无需不断地向服务器发送请求。

    对WordPress用户和开发人员的影响

    如果您是使用WordPress的用户和/或开发人员,那么REST API有很多含义。

    对于用户,这些包括:

    • 对界面的更改,包括古腾堡编辑器。
    • 对WordPress移动应用程序的更改和改进。
    • 随着时间的推移,自托管的WordPress管理屏幕看起来更像WordPress.com屏幕。

    对于开发者来说,还有更广泛的意义和可能性:

    • 能够使用REST API创建SPA,从WordPress中提取数据,但看起来与WordPress非常不同。
    • 将WordPress与其他前端技术和系统集成的能力。
    • 如果您是不编写PHP的前端开发人员,则可以使用WordPress进行开发。
    • 对于PHP开发人员来说,越来越需要扩展您的技能以包含JavaScript。
    • 特定更改,例如需要在页面和后期编辑屏幕中构建古腾堡区块而不是元框。

    随着时间的推移,WordPress REST API将意味着更多的WordPress核心将用JavaScript而不是PHP编写。如果您是WordPress开发人员,这意味着您需要学习JavaScript。

    REST API和JSON如何协同工作

    最后,REST API在可用于平台的接口方面提供了更高的灵活性。它使管理界面完全可选,因为您现在可以完全通过JSON命令与您的WordPress站点进行交互。让我们看看JSON和REST API如何结合起来使这成为可能。

    WordPress REST API是为了响应网站和应用程序开发方式的变化以及更广泛地开放WordPress的需要而开发的。

    到目前为止,您应该对WordPress REST API的理论方面有所了解,所以让我们看看该技术更实用的方面。官方手册介绍如何使用REST API,如下所示:

    “WordPress REST API为WordPress数据类型提供API端点,允许开发人员通过发送和接收JSON(JavaScript Object Notation)对象与站点进行远程交互。”

    我们需要关注的第一个词是“端点”。将端点视为可以使用JSON请求调用的一段数据或函数的最简单方法。默认情况下,WordPress提供了大量可供使用的标准端点,但开发人员也可以创建自定义端点

    要到达端点,您必须使用采用普通URL形式的“路由”。您现在甚至可以自己尝试一下。转到您自己的WordPress站点,并将/wp-json/wp/v2 添加到其URL的末尾。如果您的站点是http://example.com,您将输入http://example.com/wp-json/wp/v2

    当您加载此路由时,您将到达端点,在这种情况下,它以(凌乱的)JSON格式返回站点的所有内容和元数据。通过使用不同的路由,您可以访问不同的端点,以获取特定类型的信息并执行各种任务。

    您将在REST API中使用三个主要的JSON请求,所以现在让我们快速浏览一下它们。他们是:

    • GET-此类请求用于从API检索和列出数据。例如,您将使用GET请求返回您网站上的用户列表或编译特定时间范围内的博客文章。
    • POST-此请求用于向API发送数据。它使您能够将新信息推送到WordPress,例如添加新用户和帖子或更新现有数据。
    • DELET-顾名思义,这个请求是用来删除数据的。这使您能够删除文章、页面、用户等。

    有时可以将GET和POST与相同的端点一起使用以获得不同的结果。例如,让我们看看端点/me/settings/。如果您要在此端点上执行GET请求,您将收到当前用户设置的列表。但是,通过在同一端点上使用POST请求,您将能够改为更新设置。

    如何访问WordPress REST API

    您如何访问WordPress REST API?

    要访问WP-REST API,您需要通过命令行访问您的站点。对于WordPress,这称为WP-CLI。您不会通过管理屏幕或直接访问您网站上的代码来执行任何这些操作。

    让我们来看看你是如何开始的。

    通过WP-CLI 访问WP-REST

    WP-CLI是WordPress命令行界面。它允许您通过计算机上的命令行界面 (CLI) 访问和使用WordPress。

    要访问CLI,请在Mac或Linux中打开终端,或在Windows中打开命令提示符。

    WordPress REST API入门基础知识点-1
    Mac上的终端

    要访问远程站点,您需要SSH到您的服务器以通过WP-CLI访问它(无法通过SSH连接?了解如何修复SSH“连接被拒绝”错误)。

    要访问本地站点,您只需从命令行使用正确的目录结构。在实际站点上试用REST API之前,最好先在本地测试站点上试用REST API。

    您需要专门访问您网站的REST API,如下所示:

    http://yoursite.com/wp-json/wp/v2

    然后,您可以在此之后添加元素以访问某些类型的数据,我们稍后将更详细地介绍这些数据。这些元素称为端点。

    验证

    访问站点后,您可能需要进行身份验证。一些端点是公共的,不需要身份验证,而其他端点则需要。

    您不是在此处登录站点管理员:REST API的处理方式略有不同。

    为了能够通过WP-CLI对您的站点进行身份验证,您需要安装一个身份验证插件。对于开发安装,Basic Auth插件可以完成这项工作并且很容易使用。

    但是,对于实时站点,您应该使用更强大的身份验证形式,例如JWT身份验证插件,它使用JSON Web Token并且更安全。

    然后,您可以使用命令行访问数据并包括身份验证。

    下面的示例curl用于测试与WordPress的连接。它将输出一个草稿列表。

    curl -X GET --user username:password -i http://yoursite.com/wp-json/wp/v2/posts?status=draft

    草稿帖子不是公开信息,因此您需要进行身份验证才能访问它们。但是,如果您要查找公开数据,则不需要身份验证。因此,要检索已发布的文章列表,您可以使用:

    curl -X GET http://yoursite.com/wp-json/wp/v2/posts

    这将获取所有已发布的文章,因为这些帖子是公开的。

    WordPress REST API命令概述

    我们现在将把所有这些理论付诸实践,并向您展示一些非常基本的示例,说明您可以使用REST API做什么。这只是一种尝试,以帮助您习惯使用REST API来处理对WordPress的请求。有关更多示例,我们建议您查看官方参考库REST API资源

    以下技术将要求您使用命令行来处理JSON请求。这使您能够通过使用基于文本的界面和发送简单的命令与您的 WordPress 站点进行交互。如果您没有任何使用命令行的经验,我们建议您先花一些时间学习基础知识。您可能还想使用SSH来创建与您的站点的连接。

    最后,当您准备好时,让我们看一些有关如何使用WordPress REST API的示例!

    一旦您访问了您的站点并且您知道如何使用身份验证(以及您是否需要),您将需要使用一系列命令中的一个来与您的站点进行交互。

    您需要使用的命令是:

    • GET 检索资源,例如文章或其他一些数据。
    • POST 向服务器添加资源,例如文章、附件或其他资源。
    • PUT 可用于编辑或更新服务器上已有的资源。
    • DELETE从服务器中删除资源。小心使用!

    让我们依次来看看其中的每一个。

    Get

    GET命令可能是最常用的:它检索数据。下面的示例(您在成功访问您的网站后使用)将获取您网站中所有已发布页面的列表:

    GET http://yoursite.com/wp-json/wp/v2/posts/?status=published

    请注意,我没有在上面的行中包含您站点的完整路径,因为您已经使用WP-CLI访问了该路径。

    检索到该数据后,您可以使用它来通知您的下一步。您可以删除其中一个文章,对其进行编辑或更新。您可以简单地将帖子输出到您的网络应用程序。

    假设您想获取最新的文章。你会用这个:

    GET http://yoursite.com/wp-json/wp/v2/posts/?per_page=1

    在处理文章时,您可以使用许多参数。有关更多信息,请参阅WordPress REST API 手册

    Post

    POST用于向您的站点添加新数据或资源。

    因此,例如,如果您想创建一个文章,您可以使用以下POST命令开始:

    POST http://yoursite.com/wp-json/wp/v2/posts/

    这将创建一个新的空草稿文章。

    然后,您可以通过使用PUT命令进行编辑来更新文章。

    使用POST命令,您还可以添加文章以外的其他资源,包括附件和其他文章类型。

    要将页面添加到您的站点,您可以使用以下方法:

    POST http://yoursite.com/wp-json/wp/v2/posts/pages

    这会以与创建空文章相同的方式创建一个空页面。

    Put

    PUT命令允许您编辑现有资源,包括文章。

    假设您的网站上有许多草稿文章。您想检查它们并更新其中一个以使其发布。

    您可以首先获取所有草稿文章的列表:

    POST http://yoursite.com/wp-json/wp/v2/posts/?status="draft"

    系统将为您提供所有当前草稿文章的列表。您可以使用其ID更改其中之一的状态:

    PUT http://yoursite.com/wp-json/wp/v2/posts/567

    这将访问该文章并允许您对其进行编辑。然后,您可以使用status参数更改其状态:

    {
    "status" = "publish"
    }

    或者您可以向文章添加内容并发布它:

    {
    "status" = "publish"
    "content" = "content here"
    }

    服务器将返回一个200 - OK状态,告诉您PUT请求已成功编辑文章。

    DELETE

    DELETE命令执行您所期望的操作:它删除一个资源。默认情况下,如果您使用它来删除文章,它会将其放入垃圾箱,而不是永久删除。

    因此,如果您想将刚刚创建的文章移至垃圾箱,您可以使用以下命令:

    DELETE http://yoursite.com/wp-json/wp/v2/posts/567

    但是,如果您想绕过垃圾箱并永久删除它,您可以使用以下force参数:

    DELETE http://yoursite.com/wp-json/wp/v2/posts/567?force=true

    这将永久删除文章,无法撤消,因此应谨慎使用。

    一些例子

    1. 从站点返回文章

    虽然您显然需要适当的授权来编辑站点,但几乎可以从任何 WordPress 站点检索一些信息。这是因为REST API在所有WordPress安装中都是一致的。

    正如我们所讨论的,API存在的一个主要原因是使外部应用程序能够访问您的某些数据。在此示例中,我们可以从官方WordPress新闻博客中检索单个文章

    curl https://wordpress.org/news/wp-json/wp/v2/posts/1
    curl https://wordpress.org/news/wp-json/wp/v2/posts/1
    curl https://wordpress.org/news/wp-json/wp/v2/posts/1

    ID已设置为1,这意味着此请求将检索博客上的第一篇文章。可能很难看到,因为JSON不是很可读,但是在代码中,您可以找到文章的所有内容和元数据。

    JSON数据示例

    然后,您可以在应用程序中使用此信息,例如,使用您自己的自定义样式来显示它。

    如果您想返回博客中的每篇文章,您所要做的就是删除末尾的ID。但是,您更有可能希望返回选定数量的帖子。以下请求将返回最新的三个文章:

    curl https://wordpress.org/news/wp-json/wp/v2/posts/?per_page=3
    curl https://wordpress.org/news/wp-json/wp/v2/posts/?per_page=3
    curl https://wordpress.org/news/wp-json/wp/v2/posts/?per_page=3

    您可以在其他网站甚至您自己的博客上亲自尝试。

    2. 更新文章

    现在,让我们尝试使用REST API对WordPress进行一些更改。为此,您需要登录到要管理的站点。例如,如果您使用SSH,则需要登录到您的服务器。

    在这个例子中,我们将更新一个现有的文章。首先,让我们使用一个请求来更新ID为1的文章的标题:

    curl -X POST http://example.com/wp-json/wp/v2/posts/1 -d ‘{“title”:”A Brand New Title”}’
    curl -X POST http://example.com/wp-json/wp/v2/posts/1 -d ‘{“title”:”A Brand New Title”}’
    curl -X POST http://example.com/wp-json/wp/v2/posts/1 -d '{"title":"A Brand New Title"}'

    这是不言自明的。title参数表明您正在更新文章的标题,后跟包含替换内容的文本字符串。

    还有很多其他的参数,你可以用它来进行更改后。例如,您可以使用列表为文章分配类别、发布文章或完全更改其内容。

    3. 删除用户

    最后,让我们看看如何使用REST API删除数据。在此示例中,我们将从站点中删除用户。当然,您需要先登录并授权管理用户,然后才能使用此功能。

    然后,您可以使用以下请求删除ID为101的用户:

    curl -X DELETE http://example.com/wp-json/wp/v2/users/101
    curl -X DELETE http://example.com/wp-json/wp/v2/users/101
    curl -X DELETE http://example.com/wp-json/wp/v2/users/101

    这将从站点中删除指定的用户。您可以使用附加参数根据用户的ID将用户的文章重新分配给另一个用户,或者强制永久删除而不是将用户添加到垃圾箱。

    通过这些示例,您可以开始了解REST API如何使您能够管理站点上的内容并连接到其他站点。如果您想了解更多信息,我们建议您深入研究REST API手册,并查看有关学习JSON的课程

    何时不使用WordPress REST API

    WordPress REST API并不总是开发网站或应用程序的正确方法。在使用它进行开发之前,您应该注意以下一些注意事项:

    兼容性

    如果您的应用程序将在不运行JavaScript的设备上或由可能关闭它的用户使用,那么如果您使用的是REST API,它就不会运行。

    用PHP编码的WordPress站点将输出HTML,因此不会遇到此问题。不使用JavaScript的设备越来越少,但如果您专门为这些设备开发,REST API将无法工作。

    同样,如果您的用户可能会关闭JavaScript,那么使用REST API会导致问题。出于可访问性或安全原因,某些用户会在其浏览器中关闭JavaScript。

    无障碍

    使用JavaScript开发的站点或应用程序并不总是像HTML输出那样易于访问。

    这主要是因为JavaScript用于传递动态内容的方式可能无法与屏幕阅读器很好地配合使用,并且可能会给视力障碍或光敏性癫痫患者带来问题。

    使用REST API访问您的WordPress站点并以可访问的形式输出数据意味着您可以克服这些问题,但在开发站点时检查站点的可访问性是值得的。

    搜索引擎优化

    频繁刷新的单页应用程序有时会导致SEO问题。这是因为第一次输出页面时未交付的内容可能不会被搜索引擎索引。

    谷歌和其他搜索引擎正在迎头赶上这样一个事实,即现在许多网站都由SPA驱动,并且正在适当地将它们编入索引。但是,对您使用REST API开发的任何站点进行彻底的SEO审核确实值得。

    如何禁用WordPress REST API

    如果您不希望应用程序能够使用REST API从您的站点访问数据,您可以禁用它。请记住,任何人都可以访问公共数据,而不仅仅是您。

    为此,您可以安装Disable WP REST API插件。这将为未登录到您的站点的任何人禁用REST API。

    禁用WP REST API插件

    禁用WP REST API插件

    或者,您可以向主题的函数文件中添加一些代码或编写自己的插件。最好编写一个插件,因为这不是特定于主题的功能。

    在您的插件中,只添加两行:

    add_filter( ‘json_enabled’, ‘__return_false’ );
    add_filter( ‘json_jsonp_enabled’, ‘__return_false’ );
    add_filter( ‘json_enabled’, ‘__return_false’ );
    add_filter( ‘json_jsonp_enabled’, ‘__return_false’ );
    add_filter( 'json_enabled', '__return_false' );
    add_filter( 'json_jsonp_enabled', '__return_false' );
    

    这将完全禁用您站点的REST API。它可能会对您的管理屏幕产生连锁反应,因此请确保添加后一切正常。

    使用WordPress REST API的实际应用程序

    REST API为WordPress的未来提供了一些令人兴奋的可能性。以下是使用WordPress REST API创建SPA或将WordPress链接到其他站点和技术的应用程序和站点的一些示例。

    WordPress.com

    WordPress.com界面

    WordPress.com界面

    WordPress.com管理屏幕完全使用REST API构建,以提供用户与之交互以管理其站点的SPA。

    这使得界面和服务器之间的动态通信成为可能,并导致WordPress.org可能及时模仿的用户友好界面。

    区块编辑器(古腾堡)

    古腾堡编辑器

    古腾堡编辑器

    同样在WordPress管理屏幕中,但这次也在自托管WordPress中,Gutenberg区块编辑器使用REST API与您的数据库进行通信并创建块。

    要使文章类型与Gutenberg编辑器一起使用,它们必须启用REST API。这意味着,如果您要注册自定义文章类型并使用Gutenberg,则需要添加以下行以启用该文章类型的区块编辑器:

    “show_in_rest” = true;
    “show_in_rest” = true;
    "show_in_rest" = true;

    Event Espresso

    Event Espresso

    Event Espresso

    Event Espresso是一个WordPress插件,可让用户组织和宣传活动。它利用REST API,以便用户可以从WordPress外部访问其中的数据。这意味着您可以构建移动应用程序或SPA来管理您的活动。

    UsTwo

    UsTwo

    UsTwo

    UsTwo是一家数字机构,其网站是使用REST API作为单页应用程序构建的。这结合了使用React构建的前端和由WordPress提供支持的后端。

    他们的单个页面的内容是模块化的,其结构与标准的WordPress页面不同。为了完成这项工作,他们使用了一个自定义页面构建器插件,让他们的团队可以向站点添加模块化内容。

  • 什么是WordPress Heartbeat API以及如何管理它

    什么是WordPress Heartbeat API以及如何管理它插图

    2013年,WordPress引入了Heartbeat API——一种允许您的浏览器自动与服务器通信的功能。但是,此功能有几个缺点。

    如果您使用共享主机计划,则需要仔细查看服务器的CPU使用率。那是因为当您超出限制时,一些托管公司可能会暂停您的帐户。

    在这里,我们将讨论为什么WordPress Heartbeat API是导致问题的常见嫌疑人,及如何禁用和修改Heartbeat API频率。

    什么是WordPress Heartbeat API?

    WordPress Heartbeat API在浏览器和服务器之间提供了一种使用AJAX调用的通信协议

    顾名思义,API将在接收到数据时发送连续脉冲并触发事件(或回调)。此功能可帮助您在服务器和WordPress仪表盘之间同步所有数据。

    Heartbeat API背后的想法非常引人注目。例如,当您从编辑器创建/编辑文章时,它提供了定期自动保存文章的功能。

    在协作WordPress网站中,它具有后锁定功能,以防止您编辑其他用户正在处理的文章。如果您使用电子商务插件,此API还将有助于显示您网站上发生的销售情况。

    为什么要限制WordPress Heartbeat API?

    虽然具有自动保存功能和实时数据通知功能是有益的,但在特定情况下可能是有害的。

    Heartbeat API使用/wp-admin/admin-ajax.php文件发送AJAX请求(POST 请求) 。每个执行PHP文件的请求都等于服务器上的CPU时间。

    这可能会导致向托管服务器发送大量请求,从而导致CPU使用率过高。

    正如我们之前提到的,对于具有共享托管计划的网站管理员来说,这可能是一个问题。当您达到配额限制时,高CPU使用率最终会导致帐户暂停。

    因此,如果您遇到的问题会导致POST-admin-ajax.php出现峰值,这里有一个教程可以帮助您解决这个问题

    停止Heartbeat API之前需要考虑的事项

    如果您打算完全停止Heartbeat API,则需要三思而后行。不是因为你做不到,而是不实用。

    如果没有WordPress Heartbeat API,如果您忘记单击“保存草稿”按钮,您在文章中所做的所有更改都将丢失。您将无法再访问WordPress中的修订功能

    如果您安装使用Heartbeat API的WordPress插件,您也无法在您的站点上显示实时通知和信息功能。

    但是,如果您是一个人工作,并且所有这些功能对您来说并不重要,那么您可以继续停止WordPress Heartbeat API。

    否则,您可能会考虑改为控制API。

    如何使用插件限制WordPress Heartbeat API?

    您可以使用Heartbeat Control插件控制Heartbeat API向您的服务器发送回调的频率。

    安装并激活插件后,转到Settings -> Heartbeat Control Settings。在这里,您可以为API设置一定的规则。

    • Heartbeat Behavior– 允许您启用心跳禁用心跳修改心跳
    • Location– 确定您要控制API的区域,它为您提供三个选项:WordPress仪表盘前端文章编辑器
    • Frequency– 您允许每个确定位置的回调次数。取值范围为15到300秒

    什么是WordPress Heartbeat API以及如何管理它-1

    在示例中,我们将Post Editor中Heartbeat API函数的频率限制为200秒。如果您有多个作者在同一个WordPress网站上工作,这是一种更实用的方法。

    您还可以在您希望控制的每个位置设置不同的值。只需单击添加另一个值按钮,并相应地进行调整。

    该插件还允许您完全禁用WordPress Heartbeat API。您可以通过为Heartbeat Behavior选择Disable Heartbeat来做到这一点。

    如何在没有插件的情况下完全停止Heartbeat API?

    您也可以在没有插件的情况下停止Heartbeat API,方法是将此代码段添加到您的活动主题functions.php文件中。

    add_action( ‘init’, ‘stop_heartbeat’, 1 );
    function stop_heartbeat() {
    wp_deregister_script(‘heartbeat’);
    }
    add_action( ‘init’, ‘stop_heartbeat’, 1 );
    function stop_heartbeat() {
    wp_deregister_script(‘heartbeat’);
    }
    add_action( 'init', 'stop_heartbeat', 1 );
    function stop_heartbeat() {
    wp_deregister_script('heartbeat');
    }

    请记住,如果您是网站的唯一工作人员并且您不需要安装使用此API的其他插件,则应该这样做。

    什么是WordPress Heartbeat API以及如何管理它-2

    从您的WordPress仪表板,转到Appearance -> Theme Editor。确保您正在编辑网站的活动主题。从右侧导航菜单中单击主题函数 (functions.php) 。将上面的代码片段粘贴在<?php标记之后,然后单击Update

    就是这样,现在您已经成功地在您的站点上禁用了WordPress Heartbeat API。

    小结

    您已经了解了WordPress Heartbeat API及其为您的站点提供的功能。尽管这无疑是有益的,但在共享托管环境中,如果您处理不当,它可能会导致相当大的问题。

    要减少服务器上的CPU使用率,您可以控制API或完全禁用它。此外,您可以使用插件或手动将代码添加到functions.php文件中。