从 Nextjs API 获取数据时出现 ERR_SSL_WRONG_VERSION_NUMBER

Question

我正在尝试从我的 NextJS api 获取一些数据，但是当我这样做时，我收到此 SSL 错误，即使当我使用

fetch~("/api/categopries")

获取时，它也显示无效的 url，但我的 api 位于同一目录中。

export default async function SectionContent() {
  const getData = async () => {
    const res = await fetch("https://localhost:3000/api/categories");

    if (!res.ok) {
      console.log("Failed to fetch data");
    }

    return res.json();
  };

  const categories: Category[] = await getData();

  return (
    <div className="p-10 space-y-14 w-full h-full">
      <div className="flex gap-x-3">
        <span className="text-3xl">📦</span>
        <span className="font-extrabold text-3xl">Todo list</span>
      </div>
      <CreateTodoDialog />
      <TodoSection />
    </div>
  );
}

这是我的API

export async function GET(req: Request) {
  const session = await getServerSession();

  if (!session?.user) {
    return NextResponse.json({ message: "Invalid session" }, { status: 400 });
  }

  const user = await prisma.user.findUnique({
    where: {
      email: session.user.email || "",
    },
  });

  if (!user) {
    return NextResponse.json({ message: "User not found" }, { status: 400 });
  }

  const categories = await prisma.category.findMany({
    where: {
      authorId: user.id,
    },
    include: {
      todos: true,
    },
  });

  return NextResponse.json(categories, { status: 201 });
}

我尝试执行 npm update 但没有解决问题。

Answer 1

您在从 Next.js API 获取数据时似乎遇到了 SSL 错误。该问题可能是因为您使用“https://localhost:3000”作为 API 端点的 URL。当您访问本地服务器时，应该使用“http://localhost:3000”而不是“https”。

尝试像这样更新您的 fetch 调用：

const res = await fetch("http://localhost:3000/api/categories");

这应该可以解决 SSL 错误。此外，请确保您的 API 端点在 Next.js API 文件中正确定义，并且路线没有拼写错误或问题。

如果进行此更改后仍然遇到问题，请仔细检查您的 Next.js 服务器设置，包括可能影响本地开发环境的任何 SSL 配置或代理。