Next.js 在getStaticProps中使用路由器

我试图从一个API中获取数据，该API根据URL的不同而有所不同，我试图使用路由器来获取数据，但它似乎在getStaticProps中不起作用

我目前拥有以下代码：

export async function getStaticProps({ router }) {
const pageRequest = `http://localhost:3000/api/posts/${router.query.pid}`
const res = await fetch(pageRequest)
const json = await res.json()
return {
    props: {
        json,
    },
}
}

它回来了：

TypeError: Cannot read property 'query' of undefined

---

获取URL中的变量以在getStaticProps内部使用的正确方法是什么？

getStaticProps

在构建时被调用。您没有路由器，因为没有执行请求

如果动态页面看起来像

/pages/[pid].js

，则可以在

context.params.pid

中访问

pid

export async function getStaticProps(context) {
  const pid = context.params.pid
  return {
    props: {}, // will be passed to the page component as props
  }
}

请注意，将静态导出与动态路由一起使用需要

getstaticpath

。您需要预先指定所有可能的ID，以便Next.js知道要生成哪些页面

export async function getStaticPaths() {
  return {
    paths: [
      { params: { pid: '1' } },
      { params: { pid: '2' } }
    ],
    fallback: true or false // See the "fallback" section below
  };
}

另外，您不能在

getStaticProps

中调用自己的API，因为它是在构建时执行的（没有服务器在运行）。您可以直接从数据库中获取数据，而无需API调用

我建议阅读更多的例子和细节

或者，您可以在客户端取回数据

---

我不确定这是否适用于您的情况，但如果您改用can getServerSideProps，则可以获得具有以下内容的查询id：

export async function getServerSideProps({ query }) {
  const pageRequest = `http://localhost:3000/api/posts/${query.pid}`
  const res = await fetch(pageRequest)
  const json = await res.json()

  return {
    props: {
        json,
    },
  }
}

---

我知道使用getStaticProps或getServerSideProps有不同的考虑因素，但正如Nikolai在回答中所描述的，在这种情况下，使用getStaticProps需要更多的步骤。

问题是我需要它是静态的，我如何从mysql获取并与getStaticProps一起使用它？有什么想法吗？谢谢！>此外，您不能在getStaticProps中调用自己的API，因为它是在构建时执行的（没有服务器在运行）。您可以直接从数据库中获取数据，而无需API调用。那部分事实上不是真的。您可以在

getStaticProps

中使用fetch或类似的函数调用API，然后将响应作为props返回到页面，无论是否进行进一步处理。导出异步函数getStaticProps（context）{const response=wait GraphQLRequest（）；//或另一个异步获取返回{props:response//来自API}}@i-know-nothing，您不能调用同一项目的自己的Next.js API。构建期间没有服务器在运行。啊，明白了，你的意思是像Next.js中定义的API路由一样。我的工作对误会不好。