Directus SDK+Next.js自动刷新/登出失败：400错误，缺少refresh_token

你的核心问题是浏览器未将refresh_token Cookie携带至Directus服务，导致自动刷新和登出操作失败。以下是针对性的配置修正和代码检查建议：

一、修正Directus容器的.env配置 #

1. 修复CORS关键配置缺失 #

当前CORS配置存在两个致命问题：

• CORS_ORIGIN='true'：仅允许同源请求，若Next.js前端与Directus不在同一域名下，浏览器会直接拦截跨域Cookie传递。需改为前端的具体域名（本地开发设为http://localhost:3000，生产环境替换为实际域名）。
• 缺少CORS_ALLOW_CREDENTIALS='true'：这是跨域请求携带Cookie的必要前提，服务器必须明确允许credentials，浏览器才会主动传递Cookie。
• 补充CORS_EXPOSE_HEADERS='Set-Cookie'：确保前端能正确接收Directus返回的Set-Cookie响应头，完成Cookie存储。

2. 调整Refresh Token Cookie属性 #

• REFRESH_TOKEN_COOKIE_DOMAIN：若前端（app.domain）与Directus服务（如api.domain）属于同一主域名的子域名，需改为.domain（带前缀点），实现子域名间Cookie共享；若为同一域名不同端口，可删除该配置或设为当前域名。
• REFRESH_TOKEN_COOKIE_SAME_SITE：跨域场景下需设为'none'，但必须配合REFRESH_TOKEN_COOKIE_SECURE='true'（仅HTTPS环境有效）；本地HTTP开发可保留'lax'。

修正后的.env示例：

ACCESS_TOKEN_TTL='2m'
REFRESH_TOKEN_TTL='6m'
CORS_ENABLED='true'
CORS_ORIGIN='http://localhost:3000' # 替换为你的Next.js前端域名
CORS_ALLOW_CREDENTIALS='true'
CORS_ALLOWED_HEADERS='Content-Type, Authorization, Cookie, Set-Cookie'
CORS_EXPOSE_HEADERS='Set-Cookie'
REFRESH_TOKEN_COOKIE_DOMAIN='.domain' # 跨子域名场景使用，否则可删除
REFRESH_TOKEN_COOKIE_SECURE='false' # 本地HTTP用false，生产HTTPS改为true
REFRESH_TOKEN_COOKIE_SAME_SITE='lax' # 生产HTTPS+跨域改为'none'

二、前端代码优化 #

1. 简化Login调用参数：SDK已通过authentication("cookie")配置了认证模式，无需在login方法中额外传递{mode: 'cookie'}，避免参数冲突：

export const directusLogin = async (credentials) => {
  const response = await directus.login(credentials.email, credentials.password);
  return response;
};

2. 限定客户端环境调用：Next.js的服务器端组件无法访问浏览器Cookie，需将directusLogin、directusLogout、directusRefresh的调用放在客户端组件（添加'use client'指令）中执行。

三、验证步骤 #

1. 重启Directus容器，确保新的.env配置生效。
2. 登录后打开浏览器开发者工具，查看Application标签下的Cookie，确认refresh_token已被正确存储，且Domain、Path属性符合预期。
3. 触发刷新或登出操作，查看Network标签下的请求头，确认Cookie字段已包含refresh_token。

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