为什么在Next.js 13.4中不使用服务器工作?

huangapple go评论78阅读模式
英文:

Why doesn't use server work in Next.js 13.4?

问题

我通过声明使用服务器的方式编写了一个函数,代码如下:

Cookies 只能在服务器操作或路由处理程序中进行修改。了解更多信息:https://nextjs.org/docs/app/api-reference/functions/cookies#cookiessetname-value-options

我一直收到这个错误。

可能的原因是什么?

import { cookies } from "next/dist/client/components/headers";

type SearchParams = {
  searchParams: {
    code: string;
  };
};

export default async function EmailLoginPage({ searchParams }: SearchParams) {
  await testCookie();

  async function testCookie() {
    "use server";
    cookies().set("test", "test");
  }

  return <></>;
}
英文:

I wrote a function by declaring use server with code like this,

Cookies can only be modified in a Server Action or Route Handler. Read more: https://nextjs.org/docs/app/api-reference/functions/cookies#cookiessetname-value-options

I keep getting this error.

What could be the reason?

import { cookies } from &quot;next/dist/client/components/headers&quot;;

type SearchParams = {
  searchParams: {
    code: string;
  };
};

export default async function EmailLoginPage({ searchParams }: SearchParams) {
  await testCookie();

  async function testCookie() {
    &quot;use server&quot;;
    cookies().set(&quot;test&quot;, &quot;test&quot;);
  }

  return &lt;&gt;&lt;/&gt;;
}

答案1

得分: 1

谢谢,但是仍然出现了相同的问题。错误信息是:只能在服务器操作或路由处理程序中修改Cookie。

这里有两个问题:

  1. 你错误地导入了cookies
  2. 只能使用actionformAction属性来调用服务器操作。

以下是更新后的代码:

import { cookies } from "next/headers";

type SearchParams = {
  searchParams: {
    code: string;
  };
};

export default async function EmailLoginPage({ searchParams }: SearchParams) {

  async function testCookie() {
    "use server";
    cookies().set("test", "test");
  }

  return (
    <form action={testCookie}>
      <input placeholder="email" name="email" type="text" autofocus required/>
      <input placeholder="password" name="password" type="password" required/>
      <button type="submit">Login</button>
    </form>
  );
}

了解更多关于服务器操作的信息。

英文:

> Thanks, but It occurs same problem. Error: Cookies can only be modified in a Server Action or Route Handler.

There are two things are going wrong here:

  1. You're importing cookies wrong.
  2. Server Actions can only be called using the action or formAction prop.

Here's the updated code:

import { cookies } from &quot;next/headers&quot;;

type SearchParams = {
  searchParams: {
    code: string;
  };
};

export default async function EmailLoginPage({ searchParams }: SearchParams) {

  async function testCookie() {
    &quot;use server&quot;;
    cookies().set(&quot;test&quot;, &quot;test&quot;);
  }

  return (
    &lt;form action={testCookie}&gt;
      &lt;input placeholder=&quot;email&quot; name=&quot;email&quot; type=&quot;text&quot; autofocus required/&gt;
      &lt;input placeholder=&quot;password&quot; name=&quot;password&quot; type=&quot;password&quot; required/&gt;
      &lt;button type=&quot;submit&quot;&gt;Login&lt;/button&gt;
    &lt;/form&gt;
  );
}

Read more about server actions.

huangapple
  • 本文由 发表于 2023年8月9日 10:19:22
  • 转载请务必保留本文链接:https://go.coder-hub.com/76864179.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定