Quotes on Design API 服务商

设计名言 API 允许用户检索关于设计的鼓舞人心的名言。在这篇博客文章中，我们将探讨使用 JavaScript 访问此 API 的各种方法。

首先，让我们看一下 API 文档，此文档提供了有关可用 API 端点、参数和响应格式的信息。

要使用 API 获取随机名言，我们可以使用以下 JavaScript 代码：

fetch('https://quotesondesign.com/wp-json/wp/v2/posts/?orderby=rand')
  .then(response => response.json())
  .then(data => {
    const quote = data[0].content.rendered;
    const author = data[0].title.rendered;
    console.log(`${quote} - ${author}`);
  })
  .catch(error => console.error(error));

在这里，我们使用 fetch 方法向 API 端点发送 GET 请求。orderby=rand 参数告诉 API 返回一个随机名言。一旦我们收到响应，我们解析 JSON 数据，并从列表中的第一项提取 content 和 title 字段。最后，我们将名言和作者记录到控制台。

如果我们知道特定名言的 ID，我们可以使用 API 通过以下代码获取它：

const quoteId = 123; // 替换为所需名言的 ID

fetch(`https://quotesondesign.com/wp-json/wp/v2/posts/${quoteId}`)
  .then(response => response.json())
  .then(data => {
    const quote = data.content.rendered;
    const author = data.title.rendered;
    console.log(`${quote} - ${author}`);
  })
  .catch(error => console.error(error));

在这里，我们简单地将 orderby=rand 参数替换为 quoteId 变量。这允许我们通过其 ID 检索特定的名言。

要一次检索多个名言，我们可以使用 API 端点中的 number 参数来指定要返回的名言数量。例如，要检索十个名言，我们可以使用以下代码：

const numQuotes = 10;

fetch(`https://quotesondesign.com/wp-json/wp/v2/posts/?orderby=rand&per_page=${numQuotes}`)
  .then(response => response.json())
  .then(data => {
    data.forEach(quote => {
      const content = quote.content.rendered;
      const author = quote.title.rendered;
      console.log(`${content} - ${author}`);
    });
  })
  .catch(error => console.error(error));

在这里，我们包括 per_page 参数来检索十个名言。然后我们遍历名言列表，并为每个名言提取 content 和 title 字段。

在这篇博客文章中，我们讨论了使用 JavaScript 访问设计名言 API 的不同方式。我们已经展示了获取随机名言、通过 ID 获取名言以及一次获取多个名言的示例。

通过使用设计名言 API，开发者可以创建激励人心的应用程序，促进创造力和设计。