使用 webhook 重新验证 Next.js 和 Sanity 文档时出现问题

Question

我正在开发一个 Next.js 13 项目，该项目使用 Sanity 作为 CMS 并部署在 Vercel 上。我设置了一个 webhook，每当在 Sanity 中添加、更新或删除新的推荐时，都会触发组件和页面的重新验证。但是，我遇到了一个 TypeError，提示“解析器不是函数”，并且我不知道如何解决它。

这是我的 webhook 代码：

import { SIGNATURE_HEADER_NAME, isValidSignature } from "@sanity/webhook";

const handler = async (req: any, res: any) => {
    try {
        const signature = req.headers[SIGNATURE_HEADER_NAME].toString();
        if (
            !isValidSignature(
                JSON.stringify(req.body),
                signature,
                process.env.NEXT_PUBLIC_SECRET_TOKEN as string
            )
        ) {
            return res.status(401).json({ message: "Invalid request" });
        }
        await res.revalidate("/");
        res.status(200).json({ revalidated: true });
        console.log("testimonial revalidated");

    } catch (error) {
        res.status(500).json({ revalidated: false, error });
    }
};

这是我收到的错误消息：

TypeError: resolver is not a function
    at /var/task/node_modules/next/dist/server/api-utils/node.js:463:16
    // ...

我怀疑该错误可能与我使用 res.revalidate 函数的方式有关，或者可能与我的导入问题有关。任何人都可以提供有关如何正确设置 Webhook 以在 Sanity 更新时触发重新验证的指导吗？

附加信息：

• 我正在使用 Next.js 版本 13 和新的应用程序目录。
• 我正在使用 @sanity/webhook 包来处理 webhook。
• Webhook 应触发组件和页面的重新验证，以响应 Sanity 文档中的更改。
• 重新验证不应涉及完整的项目重建，并且仅应在更新 Sanity 时重新验证。

更新：

我在这个问题上取得了一些进展。事实证明，最初的“解析器不是函数”错误是由于缺少函数的导出造成的。然而，我遇到了一个新问题。当我向 API 发出请求时，我始终收到“401 Unauthorized”响应，其中包含以下消息：

{
  "message": "Invalid request"
}

我尝试直接在代码中定义签名和秘密令牌，但仍然遇到相同的结果。 Webhook 似乎无法正确验证请求。

Answer 1

我认为你搞乱了签名验证。另请确保在 Sanity Webhook 和环境变量中输入验证密钥。

我将分享我的代码，这就是我的做法，尽管我使用了应用程序路由器

import { revalidateTag } from "next/cache";
import { type NextRequest, NextResponse } from "next/server";
import { parseBody } from "next-sanity/webhook";


export async function POST(req: NextRequest) {
  try {
    const { isValidSignature, body } = await parseBody<{ _type: string }>(
      req,
      process.env.SANITY_REVALIDATE_SECRET
    );

    if (!isValidSignature) {
      const message = "Invalid signature";
      return new Response(JSON.stringify({ message, isValidSignature, body }), {
        status: 401,
      });
    }

    if (!body?._type) {
      revalidateTag("page");
    } else {
      revalidateTag(body?._type);
    }

    return NextResponse.json({ body });

  } catch (err) {
    console.error(err);
    return new Response(JSON.stringify(err), { status: 500 });
  }
}