使用Next.js为社交媒体应用程序生成动态路径的正确方法是什么？
我正在用Next.js +智能构建一个社交媒体应用程序。
在社交媒体应用程序中，随着用户添加评论、喜欢等内容，数据会不断变化，因此使用getServerSideProps进行SSR是有意义的，因为在每次请求时都应该更新显示的数据，对吗？
但是，我如何处理动态路由，比如说，用户的配置文件页面、帖子等等？文档解释说，对于动态路由，我应该使用getStaticPaths和getStaticProps，但这并不保证用户的配置文件或post的数据将被更新，因为它是静态生成的。
解决这个问题的正确方法是什么？
回答 2
Stack Overflow用户
发布于 2022-04-26 00:29:50
使用getServerSideProps可以访问该函数的上下文参数。，它将具有包含动态路由的params属性。因此，例如，如果您想在/user/{handle}上拥有一个用户的配置文件，可以创建以下目录结构：
pages/
user/
[handle].js然后，在您的[handle].js文件中(是的，文件名有方括号)，您可以这样做：
export default function UserHandlePage({ handle }) {
return (<p>Handle: ${handle}</p>)
}
export async function getServerSideProps(context) {
const userHandle = context.params.handle
return {
props: {
handle: userHandle
}
}
}您不需要列出路径--任何对/user/...的访问都将通过该函数运行。还可以查看下一个动态路线文档，了解如何处理捕获所有路由和其他参数。
Stack Overflow用户
发布于 2022-04-26 03:49:42
您可以通过在pages文件夹中的文件中添加括号来处理动态路由。
例如，有一个localhost的url :3000/ivanatias (ivanatias是您的配置文件名)
页面目录
pages/
[userProfileId].js您可以阅读更多关于动态路由的信息。
现在，context.params.userProfileId将在您的url上获得参数，即ivanatias
现在，您可以对getServerSideProps中的数据库执行一个提取查询，并使用userProfileId获取数据。
export async function getServerSideProps(context) {
const userProfileId = context.params.userProfileId
const fakeFetch = await fetch(`someurl.com/profile/${userProfileId}`);
const data = await fakeFetch.json();
return {
props: {
data: data
}
}
}现在可以使用组件上的数据了。
例如
export default function profile({ data }) {
return (<h2>{data.name}</h2>)
}关于你的问题，你是要使用getStaticProps还是getServerSideProps。如果您认为数据变化不大，那么您可能可以使用增量静态再生
https://stackoverflow.com/questions/72006554
复制相似问题
腾讯云开发者
