Next.js项目Sanity写入客户端缺失Write Token报错求助

问题场景 #

基于Next.js+Sanity的衍生开源项目，配置Sanity写入客户端时触发Error: Write token not found，报错位于sanity\lib\write-client.ts第15行。已在Sanity控制台生成Write Token并添加到.env文件，但问题未解决。

报错日志 #

✓ Starting...
 ⚠ Configuration with next.config.ts is currently an experimental feature, use with caution.
 ○ Compiling /instrumentation ...
 ✓ Compiled /instrumentation in 3.7s (865 modules)
 ✓ Ready in 8.6s
 ○ Compiling / ...
 ✓ Compiled / in 14.2s (4673 modules)
 ⨯ sanity\lib\write-client.ts (15:9) @ eval
 ⨯ Error: Write token not found.
    at eval (webpack-internal:///(rsc)/./sanity/lib/write-client.ts:21:11)
    at __webpack_require__.a (E:\Github\yc_directory\.next\server\webpack-runtime.js:108:13)
    at eval (webpack-internal:///(rsc)/./sanity/lib/write-client.ts:1:21)
    at (rsc)/./sanity/lib/write-client.ts (E:\Github\yc_directory\.next\server\app\(root)\page.js:1023:1)
    at __webpack_require__ (E:\Github\yc_directory\.next\server\webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./auth.ts:13:82)
    at __webpack_require__.a (E:\Github\yc_directory\.next\server\webpack-runtime.js:108:13)
    at eval (webpack-internal:///(rsc)/./auth.ts:1:21)
    at (rsc)/./auth.ts (E:\Github\yc_directory\.next\server\app\(root)\page.js:825:1)
    at __webpack_require__ (E:\Github\yc_directory\.next\server\webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./components/Navbar.tsx:15:63)
    at __webpack_require__.a (E:\Github\yc_directory\.next\server\webpack-runtime.js:108:13)
    at eval (webpack-internal:///(rsc)/./components/Navbar.tsx:1:21)
    at (rsc)/./components/Navbar.tsx (E:\Github\yc_directory\.next\server\app\(root)\page.js:836:1)
    at __webpack_require__ (E:\Github\yc_directory\.next\server\webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./app/(root)/layout.tsx:17:76)
    at __webpack_require__.a (E:\Github\yc_directory\.next\server\webpack-runtime.js:108:13)
    at eval (webpack-internal:///(rsc)/./app/(root)/layout.tsx:1:21)
    at (rsc)/./app/(root)/layout.tsx (E:\Github\yc_directory\.next\server\app\(root)\page.js:600:1)
    at Function.__webpack_require__ (E:\Github\yc_directory\.next\server\webpack-runtime.js:33:43)
    at async getLayoutOrPageModule (E:\Github\yc_directory\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:157:10688)
    at async createComponentTreeInternal (E:\Github\yc_directory\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:157:17321)
    at async E:\Github\yc_directory\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:157:22038
    at async Promise.all (index 0)
    at async createComponentTreeInternal (E:\Github\yc_directory\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:157:21262)
    at async getRSCPayload (E:\Github\yc_directory\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:157:71871)
    at async renderToStream (E:\Github\yc_directory\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:157:91401)
    at async renderToHTMLOrFlightImpl (E:\Github\yc_directory\node_modules\next\dist\compiled\next-server\app-page-experimental.runtime.dev.js:157:84078)
    at async doRender (E:\Github\yc_directory\node_modules\next\dist\server\base-server.js:1564:34)
    at async responseGenerator (E:\Github\yc_directory\node_modules\next\dist\server\base-server.js:1807:28)
    at async DevServer.renderToResponseWithComponentsImpl (E:\Github\yc_directory\node_modules\next\dist\server\base-server.js:1851:28)
    at async DevServer.renderPageComponent (E:\Github\yc_directory\node_modules\next\dist\server\base-server.js:2223:24)
    at async DevServer.renderToResponseImpl (E:\Github\yc_directory\node_modules\next\dist\server\base-server.js:2261:32)
    at async DevServer.pipeImpl (E:\Github\yc_directory\node_modules\next\dist\server\base-server.js:973:25)
    at async NextNodeServer.handleCatchallRenderRequest (E:\Github\yc_directory\node_modules\next\dist\server\next-server.js:281:17)
    at async DevServer.handleRequestImpl (E:\Github\yc_directory\node_modules\next\dist\server\base-server.js:866:17)  
    at async E:\Github\yc_directory\node_modules\next\dist\server\dev\next-dev-server.js:377:20
    at async Span.traceAsyncFn (E:\Github\yc_directory\node_modules\next\dist\trace\trace.js:157:20)
    at async DevServer.handleRequest (E:\Github\yc_directory\node_modules\next\dist\server\dev\next-dev-server.js:374:24)
    at async invokeRender (E:\Github\yc_directory\node_modules\next\dist\server\lib\router-server.js:183:21)
    at async handleRequest (E:\Github\yc_directory\node_modules\next\dist\server\lib\router-server.js:360:24)
    at async requestHandlerImpl (E:\Github\yc_directory\node_modules\next\dist\server\lib\router-server.js:384:13)     
    at async Server.requestListener (E:\Github\yc_directory\node_modules\next\dist\server\lib\start-server.js:142:13) {
  page: '/'
}
  13 |
  14 | if (!writeClient.config().token) {
> 15 |   throw new Error("Write token not found.");
     |         ^
  16 | }
  17 |
 ○ Compiling /_error ...
 ✓ Compiled /_error in 3.5s (5117 modules)

排查与解决步骤 #

1. 确认.env文件的正确性 #

• 文件名必须是.env.local（Next.js开发环境默认加载该文件，.env仅在构建阶段生效），放置在项目根目录。
• 检查变量名拼写：确保是SANITY_WRITE_TOKEN=你的生成令牌，变量名大小写完全匹配，值前后不要加引号（令牌本身不含特殊字符时），也不要有多余空格。

2. 验证环境变量是否被读取 #

在sanity/lib/write-client.ts中临时添加日志打印，重启开发服务器后查看终端输出：

// 在创建writeClient之前添加
console.log('SANITY_WRITE_TOKEN:', process.env.SANITY_WRITE_TOKEN);

export const writeClient = createClient({
  // 你的配置
});

如果输出为undefined，说明环境变量未被加载，回到第一步检查文件。

3. 检查write-client.ts的配置代码 #

确保令牌正确传入客户端配置，且关闭CDN（写入操作必须禁用CDN）：

import { createClient } from '@sanity/client';

export const writeClient = createClient({
  projectId: process.env.SANITY_PROJECT_ID,
  dataset: process.env.SANITY_DATASET,
  apiVersion: '2024-01-01', // 使用最新的API版本
  token: process.env.SANITY_WRITE_TOKEN, // 确认变量名与.env中一致
  useCdn: false, // 写入操作必须关闭CDN
});

if (!writeClient.config().token) {
  throw new Error("Write token not found.");
}

4. 重启开发服务器 #

修改环境变量或配置文件后，必须完全关闭并重启Next.js开发服务器（npm run dev），否则新的环境变量不会生效。

5. 验证Sanity令牌权限 #

登录Sanity控制台，检查生成的Write Token是否具备编辑、创建、删除等必要权限，不要使用只读令牌。

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