next.js 我无法在接下来的js 14中访问我的API

tkclm6bt  于 2023-11-18  发布在  其他
关注(0)|答案(1)|浏览(136)

我遵循了所有的约定,并编写了我的API,但在客户端它没有到达API端点。在浏览器上,它说500内部服务器错误。问题来自客户端上的获取API部分。当试图完成请求时,在Web服务器端显示。这并没有提供关于出错的具体细节,但它表示服务器在处理请求时发生了意外情况,因此无法完成请求。
APICLIENT我的API:
这看起来对我由way.open为更正

export async function POST(request: NextRequest) {
const description = await request.json();
console.log(description);

    // const createAbout = await prisma.about.create({
    //     data: { desn cription }
    // })
    
    // if (!createAbout)
    //     return NextResponse.json(createAbout, { status: 404 })
    return NextResponse.json({ description, status: 404 });

};

个字符

t98cgbkg

t98cgbkg1#

问题在于你在调用后如何设置数据,在你的代码中,你在try and catch内部声明数据,并在try and catch外部使用它。基本上意味着你将数据重新分配给它本身:
1.在数据尝试和捕获之外解密数据
1.使用响应而不是数据:
const response = await fetch('/API/about',{ method:'POST',body:formData,});
1.然后将response赋值给data setData(respone)
完整的代码看起来类似于这样:

import { Button, Input, Textarea } from "@nextui-org/react";
import React, { FormEvent, useState } from "react";
import { useRouter } from "next/router"; 

const adminAbout = () => {
  const router = useRouter();
  const [data, setData] = useState(null); 

  async function handleSubmit(e: FormEvent<HTMLFormElement>) {
    e.preventDefault();
    try {
      const formData = new FormData(e.currentTarget);
      const response = await fetch('/api/about', {
        method: 'POST',
        body: formData,
      });
      if (response.ok) {
        const responseData = await response.json();
        setData(responseData);
        router.refresh();
      } else {
        console.error("Request failed with status:", response.status);
      }
    } catch (error) {
      console.error("An error occurred during the process:", error);
    }
  }
  return (
    <section className="mx-auto py-10 p-5 flex flex-col max-w-lg">
      <div className="">
        <h1 className="py-5 font-bold">About Form</h1>
        <form onSubmit={handleSubmit}>
          <Input name="name" placeholder="Name" />
          <Textarea name="description" placeholder="Description" />
          <Button type="submit">Submit</Button>
        </form>
      </div>
    </section>
  );
};
export default adminAbout;

字符串

相关问题