Next.js 15 Cookie修改报错：仅允许在Server Action/Route Handler中操作

可能原因及解决办法 #

1. 导入路径错误 #

你客户端组件里导入resetAuthCookies的路径是../auth/route，但该函数实际定义在actions.ts中。如果auth/route.ts里存在同名但未标记'use server'的函数，就会导致客户端意外执行未授权的Cookie修改操作，触发错误提示。

解决：修正导入路径，确保从正确的actions.ts文件导入：

// 客户端 LogoutButton 组件中
import { resetAuthCookies } from '../actions'; // 替换为正确的文件路径

2. Server Action 被错误执行时机触发 #

如果resetAuthCookies在组件渲染阶段（而非点击事件等交互触发的回调中）被调用，即使函数本身标记了'use server'，也可能在客户端环境中被意外执行，引发错误。

解决：确保只在交互事件处理函数中调用Server Action：

// 客户端组件示例
const handleLogout = async () => {
  await resetAuthCookies();
  router.push('/login');
};

// 在按钮的 onClick 中调用
<button onClick={handleLogout}>登出</button>

3. Next.js 15 开发环境误报 #

若上述两点都排查无误，但功能正常仅弹出错误提示，大概率是Next.js 15开发环境的已知误报Bug。

解决：

• 重启开发服务器
• 删除.next缓存文件夹后重新启动
• 升级到最新的Next.js 15补丁版本，官方可能已修复该误报问题

内容的提问来源于stack exchange，提问作者7sky nikkhah