如何在Next.js中从unstable_cache移除指定缓存项？

问题描述 #

我在GET API路由中有如下函数实现，请问如何在DELETE路由中从unstable_cache移除ID为x的用户缓存项？

export const GET = async (request: Request, { params }: { params: { id: string } }) => {
  const getUser = async (id: string) => {            
    // user get implementation
    return user;
  };
  // get cached data
  const cachedData = unstable_cache(async (id) => getUser(id), ['user', params.id], 60000);
  const data = await cachedData(params.id);
  return NextResponse.json(data);
}

解决方案 #

要清除指定ID的用户缓存项，核心是复用与GET路由完全一致的缓存键定位缓存条目，再调用缓存实例的revalidate方法。具体实现步骤如下：

1. 提取公共逻辑（可选但推荐）
   把getUser函数抽离到公共模块，避免在多路由中重复代码：

// lib/user.ts
export const getUser = async (id: string) => {            
  // user get implementation
  return user;
};

2. 统一GET路由缓存配置
   改用对象形式配置缓存有效期，保持逻辑清晰：

import { getUser } from '@/lib/user';
import { unstable_cache } from 'next/cache';
import { NextResponse } from 'next/server';

export const GET = async (request: Request, { params }: { params: { id: string } }) => {
  const cachedData = unstable_cache(
    async (id) => getUser(id),
    ['user', params.id], // 缓存键，必须与DELETE路由完全一致
    { revalidate: 60 } // 对应原代码的60000毫秒有效期
  );
  const data = await cachedData(params.id);
  return NextResponse.json(data);
};

3. 实现DELETE路由的缓存清除逻辑
   创建相同缓存键的unstable_cache实例，调用revalidate方法清除目标缓存：

import { getUser } from '@/lib/user';
import { unstable_cache } from 'next/cache';
import { NextResponse } from 'next/server';

export const DELETE = async (request: Request, { params }: { params: { id: string } }) => {
  // 先执行删除用户的业务逻辑
  // await deleteUser(params.id);

  // 创建与GET路由完全匹配的缓存实例
  const cachedData = unstable_cache(
    async (id) => getUser(id),
    ['user', params.id], // 缓存键必须完全一致
    { revalidate: 60 }
  );

  // 清除该ID对应的缓存项
  await cachedData.revalidate(params.id);

  return NextResponse.json({ message: '用户已删除，缓存已清除' });
};

关键说明 #

• 缓存键数组['user', params.id]是定位缓存的核心，必须与GET路由的配置完全一致，否则无法找到目标缓存条目。
• unstable_cache属于Next.js实验性API，后续版本可能存在API变更，使用时需留意官方文档更新。

内容的提问来源于stack exchange，提问作者coderman