我正在开发一个Next.js电子商务应用程序，该应用程序有很多页面，其中一些是所有产品页面、特定产品页面、博客文章页面、个人资料页面、购物车页面等等。这个应用程序需要强大的SEO，所以我选择了Next.js，然而，我对它的数据提取选项没有太多经验-SSR和SSG。我在Next.js上读了很多关于SSR和SSG的文章，但我不确定我是否理解正确。
由于我是这方面的新手，对于几乎所有需要在呈现之前从RESTful API加载内容的页面，我都选择了getServerSideProps。然而，我看到一篇文章说，产品页面的最佳选择是将getStaticProps与getStaticPaths一起使用fallback = true，如果某个页面尚未预呈现，则呈现加载指示符。然而，我的应用程序经常更改数据，数据库中包含超过1万个定期删除、编辑或添加的产品。我的第一个问题是，在这种情况下，getStaticProps和getStaticPaths是否是一个好的选择产品数据是否会随着每次页面浏览而更新或者我需要SSR吗客户总是需要查看产品的最新更新。同样的问题也适用于所有产品页面，因为它应该只显示当前可用的产品，并在缺货时隐藏它们。
我的第二个问题是关于部署。我知道，如果应用程序是静态构建和导出的，它可以部署到静态/共享托管。然而，如果我在应用程序中使用SSR，据我所知，我必须使用虚拟服务器来托管应用程序。根据第一个问题，托管此类应用程序的选项是什么？
非常感谢你的回答。
使用getServerSideProps(SSR(数据是在请求时提取的，因此您的页面将具有更高的第一个字节时间(TTFB(，但始终使用新数据预呈现页面。
使用静态生成(SSG(HTML在构建时生成，并将在每次请求时重复使用，TTFB较慢，页面通常较快，但每次更新数据时都需要重新构建应用程序(博客可以接受，但电子商务不能接受(。
通过增量静态再生(ISG(，静态内容也可以是动态的，页面将通过基于间隔的HTTP请求在后台重建。您可以指定在getStaticProps中使用revalidate key更新页面的频率，这与fallback : true非常配合，并允许您(几乎(始终更新内容：
function Blog({ posts }) {
const { isFallback } = useRouter(); // if true show loading indicator
return (
// your page content
)
}
export async function getStaticPaths() {
return {
// no pages are generated at build time
paths: [],
// Enabling statically generating all pages
fallback: true,
}
}
// This function gets called at build time on server-side.
// It may be called again, on a serverless function, if
// revalidation is enabled and a new request comes in
export async function getStaticProps() {
const res = await fetch('https://.../posts')
const posts = await res.json()
return {
props: {
posts,
},
// Next.js will attempt to re-generate the page:
// - When a request comes in
// - At most once every second
revalidate: 1, // In seconds
}
}
export default Blog
注意事项：ISG在重新验证时受到了过时的启发，这意味着如果你的页面在一年内没有访问，即使你的重新验证时间是1秒，一年后的第一个用户将看到一年前的数据，因此从技术上讲，用户不会总是看到更新的数据。请参阅我关于按需重新验证的回答，了解更多信息和资源。
next export允许您在服务器上没有节点环境的情况下为网站提供服务(它生成静态文件(，请参阅，但ISG和SSR 不支持
1。对于这种情况，getStaticProps和getStaticPaths是一个不错的选项吗？
答案getStaticProps和getStaticPaths是Incremental Static Generation的不错选择，适用于您的案例，即电子商务应用程序。
2.产品数据是否会随每个页面的浏览而更新？
答案您可以在一段时间后再次预呈现产品页面。以下是它的工作原理：
1. Next.js can define a "timeout" for this page — let’s set it at 60 seconds.
2. The data for product Y is updated.
3. When the page for product Y is requested, the user will see the existing (out of date) page.
4. When another request comes in 60 seconds after the previous request, the user will see the existing (out of date) page. In the background, Next.js pre-renders this page again.
5. Once the pre-rendering has finished, Next.js will serve the updated page for product Y.
这种方法被称为增量静态再生。要启用此功能，可以在getStaticProps中指定revalidate:60
3.在哪里部署nextjs应用程序？
答案Next.js可以部署到任何支持Node.js的托管提供商，当然还有用于存储产品数据和其他CRUD操作的数据库。
供参考：
- https://vercel.com/blog/nextjs-server-side-rendering-vs-static-generation
- https://nextjs.org/learn/basics/deploying-nextjs-app/other-hosting-options