Laravel Sanctum CSRF Token不匹配：Vue前端无法设置CSRF Cookie

1. 修正环境变量的引号格式 #

你的fly.toml里使用了中文单引号，这会导致环境变量值解析错误——Laravel读取到的实际值是包含引号的字符串（比如‘my-app.fly.dev’），而非预期的纯域名。请把引号换成英文单引号，或直接去掉引号（域名无空格时可省略）：

SANCTUM_STATEFUL_DOMAINS = "my-app.fly.dev"
SESSION_DOMAIN = "api-your-app.fly.dev"  # 替换为你的后端实际完整域名

2. 调整SESSION_DOMAIN的值 #

fly.dev属于浏览器公共后缀列表（Public Suffix List）中的域名，浏览器会拒绝将这类公共后缀作为Cookie的domain属性，这是你遇到错误的核心原因。

正确设置规则：

• 直接将SESSION_DOMAIN设为后端应用的完整域名（比如你的后端fly.io域名是api-my-app.fly.dev，就填这个值）
• 不要使用fly.dev作为domain，浏览器会判定该值无效

3. 确认SANCTUM_STATEFUL_DOMAINS配置 #

确保该值是前端的完整域名（无需带协议）：

SANCTUM_STATEFUL_DOMAINS = "my-app.fly.dev"

4. 检查Laravel的CORS配置 #

在Laravel项目的config/cors.php文件中：

• 将allowed_origins设置为前端的完整URL：['https://my-app.fly.dev']
• 确保supports_credentials设为true：

'supports_credentials' => true,

5. 前端请求开启Cookie携带 #

确保前端请求配置中开启withCredentials，才能正常接收和发送Cookie：

• 若使用Axios，可全局设置：

axios.defaults.withCredentials = true;

• 或单独在请求/sanctum/csrf-cookie时设置：

axios.get('/sanctum/csrf-cookie', { withCredentials: true })

本地与线上差异说明 #

本地环境中localhost不属于公共后缀，因此可以直接设置SESSION_DOMAIN=localhost；但线上的fly.dev是公共后缀，浏览器会严格限制Cookie的domain设置，这就是本地正常但线上出错的核心差异。

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