使用 sveltekit 时如何处理服务器端的更新逻辑?

How to handle update logic in server side when using sveltekit?

提问人:Jay0813 提问时间:9/13/2023 更新时间:9/13/2023 访问量:37

问:

我正在使用 sveltekit。 我想要的是更新输入数据。 更新本身很简单,但是有一个问题,那就是我需要在标头中发送一个accessToken来立即发送更新API请求。 但是,此令牌当前包含在作为 httpOnly:true 处理的 cookie 中。 所以我无法将该 cookie 导入 JavaScript,所以我认为我需要在服务器端处理更新逻辑。

我试图通过服务器端的动作功能来解决它,但我遇到了以下问题。

  1. 当我按下校正按钮时,我写的输入数据正在初始化。
  2. 不知道是不是因为输入值的初始化,但是动作函数没有得到我输入的值。

下面是我写的代码。

// +page.svelte
<form action="?/updateUser" method="post" use:enhance>
    <div class="mb-6">
        <Label for="email-input" class="block mb-2">email</Label>
        <div class="flex gap-4 w-full">
            <Input id="email-input" size="lg" placeholder="email" bind:value={_email} />
            <Button type="submit" class="w-fit whitespace-nowrap text-sm" disabled={!isEmailChanged}
                >Edit</Button
            >
        </div>
    </div>
</form>

// +page.server.ts
export const actions: Actions = {
    updateUser: async ({ cookies, request }) => {
        const data = await request.formData();

        const email = data.get('email-input') as string;
        console.log({ email });

        // throw redirect(303, '/protected?page=1');
    }
};

欢迎任何建议。谢谢

typescript 访问令牌 补丁 sveltekit cookie-httponly

评论


答:

2赞 H.B. 9/13/2023 #1

我不明白你第一点的意思,但数据可能没有被发送,因为表单数据要求输入具有属性,是无关紧要的。因此,除非组件在内部设置它,否则不会发送任何内容。nameidInput

评论

0赞 Jay0813 9/13/2023
谢谢你的回答。添加 name 属性后,将发送数据。但是,如果我单击该按钮,则输入数据在输入文件中为空。这是由表单提交默认操作引起的吗?这似乎是刷新
1赞 H.B. 9/13/2023
enhance将在提交时重置表单并使 无效 ,如果您有一个返回当前电子邮件地址的函数并将其传递给输入(例如),则该值在提交后应该是正确的。还可以从操作中返回一个对象,该对象将传递给属性。一个常见的模式是 。请参阅表单操作文档,那里有很多详细信息。dataloadvalue={data.email}formvalue={form?.email ?? ''}
0赞 Jay0813 9/13/2023
非常感谢您的帮助。我必须仔细阅读文件祝你有美好的一天!