Next-Drupal 1.3

2022 年 4 月 19 日 - @shadcn


自从去年 12 月发布 next-drupal 1.0 以来,我们见证了惊人的采用率。我们的社区规模已超出预期。我们现在每周的下载量已接近 **1000+**。

今天,我们很高兴发布 next-drupal 1.3,这是我们最重要的版本之一。

Next-Drupal 1.3 推出了一个功能强大且灵活的 JSON:API 客户端,用于从 Drupal 获取数据。

它取代了诸如 getResourcegetResourceCollection 之类的功能性辅助函数,并提供了大量定制选项。

DrupalClient 是一个可选功能。您可以安全地将您的网站升级到 next-drupal 1.3.0,没有任何重大更改。

功能

  1. 可定制的 JSON:API 客户端,用于数据获取.
  2. 用于获取资源、菜单、视图和搜索索引的辅助函数.
  3. 支持自定义身份验证 - BearerBasic 或自行提供。
  4. 支持自定义序列化器.
  5. 支持自定义提取器.
  6. 支持缓存资源 - 内存缓存、Redis 等。
  7. 改进的错误消息

DrupalClient

DrupalClientnext-drupal ^1.3.0 中以 实验性 功能提供。

import { DrupalClient } from "next-drupal"
 
const drupal = new DrupalClient("https://example.com")
 
// Fetch articles.
const articles = await drupal.getResourceCollection("node--article")

数据获取

每个数据获取辅助函数都已升级并变得更加灵活,可以用于身份验证、本地化和缓存。

import { drupal } from "lib/drupal"
 
// Fetch articles.
const articles = await drupal.getResourceCollection("node--article")
 
// Fetch articles with translation.
const articles = await drupal.getResourceCollectionFromContext(
  "node--article",
  context
)
 
// Get static paths for resources.
const paths = await drupal.getStaticPathsFromContext(
  ["node--article", "node--page"],
  context
)
 
// Make an auth request to fetch a block.
const menu = await drupal.getResource(
  "block_content--basic",
  "42487873-3aad-44ab-8dd6-c2fb0d82bb8f",
  {
    withAuth: true,
  }
)
 
// Fetch a menu and cache the response during build.
const menu = await drupal.getMenu("main", {
  withCache: process.env.NEXT_PHASE === PHASE_PRODUCTION_BUILD,
  cacheKey: `menu:main`,
})

身份验证

除了 Bearer 令牌(通过 Simple OAuth)之外,您现在可以提供自己的自定义身份验证实现来获取 Drupal 数据。

Bearer

要配置身份验证,请提供 client_idclient_secret 作为选项。

export const drupal = new DrupalClient(
  process.env.NEXT_PUBLIC_DRUPAL_BASE_URL,
  {
    auth: {
      clientId: process.env.DRUPAL_CLIENT_ID,
      clientSecret: process.env.DRUPAL_CLIENT_SECRET,
    },
  }
)

DrupalClient 将获取 Bearer 令牌并为您处理过期问题。

Basic

您还可以使用以下 basic 授权标头

⚠️

您需要在 Drupal 上启用 basic_auth 模块。

export const drupal = new DrupalClient(
  process.env.NEXT_PUBLIC_DRUPAL_BASE_URL,
  {
    auth: () =>
      "Basic " +
      Buffer.from(
        `${process.env.BASIC_AUTH_USERNAME}:${process.env.BASIC_AUTH_PASSWORD}`
      ).toString("base64"),
  }
)

回调

您还可以提供自定义身份验证回调。回调必须返回一个 Authorization 兼容标头。

export const drupal = new DrupalClient(
  process.env.NEXT_PUBLIC_DRUPAL_BASE_URL,
  {
    auth: () => {
      // Authenticate and return headers.
    },
  }
)

序列化器

DrupalClient 使用 jsona 作为默认序列化器,用于对 JSON:API 数据进行序列化和反序列化。

您可以使用 serializer 选项提供您自己的序列化器。

import { Deserializer } from "jsonapi-serializer"
 
const customSerializer = new Deserializer({
  keyForAttribute: "camelCase",
})
 
export const drupal = new DrupalClient(
  process.env.NEXT_PUBLIC_DRUPAL_BASE_URL,
  {
    serializer: customSerializer,
  }
)

提取器

您现在可以使用 fetcher 选项提供您自己的提取器。这将替换 Next.js 的填充的 fetch,用于 JSON:API 调用。

import { DrupalClient } from "next-drupal"
import crossFetch from "cross-fetch"
 
const fetcher = (url, options) => {
  const { withAuth, ...opts } = options
 
  if (withAuth) {
    // Make additional requests to fetch a bearer token
    // Or any other Authorization headers.
  }
 
  return crossFetch(url, {
    ...opts,
    // Pass in additional options. Example: agent.
  })
}
 
export const drupal = new DrupalClient(
  process.env.NEXT_PUBLIC_DRUPAL_BASE_URL,
  {
    fetcher,
  }
)

缓存

DrupalClient 支持缓存资源。您可以使用 cache 选项提供您自己的缓存实现。

以下是如何使用 Redis 缓存资源的示例。

import { DrupalClient, DataCache } from "next-drupal"
import Redis from "ioredis"
 
const redis = new Redis(process.env.REDIS_URL)
 
// Create a custom cache.
export const redisCache: DataCache = {
  async set(key, value) {
    return await redis.set(key, value)
  },
 
  async get(key) {
    return await redis.get(key)
  },
}
 
export const drupal = new DrupalClient(
  process.env.NEXT_PUBLIC_DRUPAL_BASE_URL,
  {
    cache: redisCache,
  }
)

现在,当您进行 getResourcegetMenu 调用时,您可以告诉客户端缓存并重新使用响应。

import { PHASE_PRODUCTION_BUILD } from "next/constants"
 
const menu = await drupal.getMenu("main", {
  withCache: process.env.NEXT_PHASE === PHASE_PRODUCTION_BUILD,
  cacheKey: `menu:main`,
})

错误消息

我们改进了客户端的错误消息,并支持格式化的 JSON:API 错误。

Error messages

升级

您可以按照我们的升级指南 此处,立即尝试新的 DrupalClient