Next.js action 调 Storefront 库存没更新
现象#
在 'use server' 的 action 里查 quantityAvailable,页面一直显示 10 件,后台已经改成 0;本地 dev 正常,部署到 Vercel 后必现。
原因#
- Next.js 对 fetch 默认接入 Data Cache,POST 在部分版本也会被记住
- route segment 被静态化,action 返回后页面没有重新验证
- 私有令牌只放在服务端,但没带 Shopify-Storefront-Buyer-IP,所有请求被算作同一来源
- 环境变量只在构建时注入,运行时读到空值,请求静默失败
处理步骤#
- 请求里显式写
fetch(url, { method: 'POST', cache: 'no-store', next: { revalidate: 0 } }) - 在 action 所在文件加
export const dynamic = 'force-dynamic' - 写完后调用
revalidatePath('/products/[handle]')或 revalidateTag - 服务端从
headers()取真实 IP,加到Shopify-Storefront-Buyer-IP - 在服务端日志打印状态码与 errors,确认不是 401 或 430 被吞掉
验收标准#
后台改库存后刷新 PDP 立即显示新值,action 日志里请求为 no-store 且响应无 errors。
本文由 风格技术 技术团队整理,适用于 Shopify 标准版与 Plus 店铺。Shopify 平台能力迭代较快,具体操作路径与字段以官方文档和店铺后台实际版本为准。