如何在sveltekit中提取cookie

Question

我试图提取从后端接收到的sveltekit中cookie的值，但我似乎无法找到在svelte中访问cookie的方法，我也在使用Typescript，如果可能的话，我不想直接访问DOM。

到目前为止，我已经尝试使用:

• js-cookie
• chatGPT anwear这是完全不正确的
• Le internet自从我在这里询问以来一直没有工作

set-cookie头显示在网络选项卡中，它既不安全也不是httponly。请解释一下我如何从sveltekit typescript中访问它的值。

编辑:后端是actix-web

已解决:我在actix端将域设置为localhost，并将cookie设置为secure。

Answer 1

我认为当你说backend你指的是用SvelteKit编写的后端，因为SvelteKit是一个全栈框架。

在SvelteKit中这样做的方式是通过在服务器加载函数中编写cookie逻辑:

import * as db from '$lib/server/database';
import type { LayoutServerLoad } from './$types';

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

return {
user: await db.getUser(sessionid)
};
}) satisfies LayoutServerLoad;

您可以对cookies.set(…)执行相同的操作。

• 示例取自文档
• 在这里找到完整的cookie参考。
关于基于cookie的认证的好文章。

---

如果你想从你的客户端苗条组件访问Cookie值，你可以通过服务器加载函数传递它到你可以在你的组件中访问的数据。

+ page.server.ts

import type { PageServerLoad } from './$types';
export const load = (async ({ cookies }) => {
const tastyCookie = cookies.get('tastyCookie');
return {
tastyCookie
};
}) satisfies PageServerLoad;

+ page.svelte

<script lang="ts">
import type { PageData } from './$types';
export let data: PageData;
</script>
<h1>{data.tastyCookie}</h1>

---

我认为你也应该能够从客户端苗条页面的onMount钩子内部访问cookie字符串，但我强烈建议使用上面显示的方法，因为这是做事情的Kit方式。