API 路由详情

以下是关于 API 路由 您应该了解的一些基本信息。

不要从 getStaticProps 或 getStaticPaths 中获取 API 路由

您不应该从 getStaticProps 或 getStaticPaths 中获取 API 路由。相反，直接在 getStaticProps 或 getStaticPaths 中编写您的服务器端代码（或调用辅助函数）。

原因如下：getStaticProps 和 getStaticPaths 仅在服务器端运行，永远不会在客户端运行。此外，这些函数不会包含在浏览器的 JS bundle 中。这意味着您可以编写诸如直接数据库查询之类的代码，而无需将它们发送到浏览器。阅读 直接编写服务器端代码 文档以了解更多信息。

一个好的用例：处理表单输入

API 路由的一个好的用例是处理表单输入。例如，您可以在页面上创建一个表单，并使其向您的 API 路由发送 POST 请求。然后，您可以编写代码以直接将其保存到数据库中。API 路由代码不会成为客户端 bundle 的一部分，因此您可以安全地编写服务器端代码。

export default function handler(req, res) {
  const email = req.body.email;
  // Then save email to your database, etc...
}

预览模式

静态生成 在您的页面从 headless CMS 获取数据时非常有用。但是，当您在 headless CMS 上编写草稿并希望立即在页面上预览草稿时，它并不理想。您希望 Next.js 在请求时而不是构建时渲染这些页面，并获取草稿内容而不是已发布的内容。您希望 Next.js 仅针对此特定情况绕过静态生成。

Next.js 具有一个名为预览模式的功能来解决上述问题，它利用了 API 路由。要了解更多信息，请查看我们的 预览模式 文档。

动态 API 路由

API 路由可以是动态的，就像常规页面一样。查看我们的 动态 API 路由 文档以了解更多信息。

就是这样！

在下一个也是最后一个基础课程中，我们将讨论如何将您的 Next.js 应用程序部署到生产环境。