SvelteKit服务端无法设置Cookie问题排查

我在SvelteKit项目的服务端页面突然无法设置Cookie。在页面的+page.server.js中，我在一个action里使用set函数设置了名为myCookie的Cookie，刷新页面后，在load函数中用get函数获取该Cookie时，却返回undefined，确定Cookie根本没被设置，但不知道原因。

代码如下：

export const load = async ({ cookies }) => {
    const myCookie = cookies.get('myCookie');
}

export const actions = {
    default: async ({ cookies }) => {
        //stuff
        cookies.set('myCookie', true);
        throw redirect(303, '/');
    }
}

这个流程我在其他项目中用过，一直都能正常工作。可能是什么问题？感谢您的帮助。

更新补充 #

我正在使用Pocketbase，并且在项目的hook.server.js中设置的Cookie可以在浏览器中看到且正常工作，代码如下：

export async function handle({ event, resolve }) {
    event.locals.pb = new PocketBase('http://127.0.0.1:8090');
    event.locals.pb.authStore.loadFromCookie(event.request.headers.get('cookie') || '');

    if (event.locals.pb.authStore.isValid) {
        event.locals.user = serializeNonPOJOs(event.locals.pb.authStore.model);
    } else {
        event.locals.user = undefined;
    }

    const response = await resolve(event, {
        transformPageChunk: ({ html }) => minify(html, minification_options)
    })
    response.headers.set('set-cookie', event.locals.pb.authStore.exportToCookie({ secure: false }));

    return response
}

问题原因及解决方案 #

核心原因 #

问题出在hook.server.js中的response.headers.set('set-cookie', ...)调用——set方法会直接覆盖所有已存在的Set-Cookie响应头，包括你在+page.server.js的action里设置的myCookie，导致后者被丢弃，浏览器根本收不到这个Cookie。

修复方案 #

1. 修改hook中的Cookie设置方式
   将response.headers.set改为response.headers.append，这样会在原有Cookie头的基础上追加新的Cookie，不会覆盖：

   // hook.server.js 中替换这一行
   response.headers.append('set-cookie', event.locals.pb.authStore.exportToCookie({ secure: false }));
   

2. 确保Cookie配置正确
   可以显式指定Cookie的path等参数，避免路径不匹配导致的Cookie无法读取：

   // +page.server.js 的action中完善cookies.set配置
   cookies.set('myCookie', 'true', {
       path: '/', // 根路径下都能访问
       secure: false, // 本地开发环境设为false，生产环境建议开启true（需HTTPS）
       httpOnly: true // 根据业务需求调整，是否允许前端JS访问
   });
   

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