我如何在 sveltekit 中提取 cookie

Question

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

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

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

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

编辑：后端是 actix-web

Answer 1

我假设当你说后端时，你指的是用 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 的身份验证的好文章。

---

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

+页面.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>

---

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