当我的网址路径似乎正确时，为什么会收到 404 错误？

Question

不明白为什么尽管我的 URL 路径是正确的，但我仍然收到 404 错误。

错误如下所示：

FormSchema.tsx:49 
 POST http://localhost:3000/pages/api 404 (Not Found)

app-index.js:33 Failed to submit form: Error: HTTP error! status: 404
    at onSubmit (FormSchema.tsx:60:15)
    at async eval (index.esm.mjs:2229:1)

这是我的代码的结构：

   /   

    ㄴ pages    

            ㄴ api      

                  ㄴroute.ts  

当用户单击提交按钮时，我在获取函数中调用pages/api，但我不断收到404 not found..我签入了邮递员，但它不起作用。该函数如下所示：

async function onSubmit(values: z.infer<typeof FormSchema>) {
    try {
      const response = await fetch('/pages/api', {
        method: 'POST', 
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(values),
      });

      console.log('Response status:', response.status);

      if (!response.ok) {
        throw new Error(`HTTP error! status: ${response.status}`);
      }

      const result = await response.json();
      console.log('Form submission result:', result);

      toast({
        title: "Form submitted successfully!",
        description: (
          <pre className="mt-2 w-[340px] rounded-md bg-slate-950 p-4">
            <code className="text-white">{JSON.stringify(result, null, 2)}</code>
          </pre>
        ),
      });
    } catch (error) {
      console.error("Failed to submit form:", error);
      toast({
        title: "Error submitting form",
        description: "Please try again later.",
      });
    }
  }

我检查了我的网址是否有问题，但似乎这不是问题所在。

Answer 1

尝试获取您要获取的位置文件的打印输出。 也许这里的情况是'/pages/api'应该在api之后有'/'，即'/pages/api/'，因为这将有助于更好地阅读route.ts。