使用NextJS从数据库动态创建静态路由



我正在努力理解Next JS是如何进行动态路由的,但我对如何在自己的网站中正确实现它有点困惑。基本上,我有一个不断增长的内容数据库(MySQL(,比方说它们是博客文章,图像存储在GCS中。据我所知,你可以在你的页面文件夹中创建一个pages/[id].js文件,该文件可以处理为新页面动态创建路由,但是,为了让你获得良好的SEO评分,谷歌爬虫需要在发出任何javascript或数据请求之前查看你的内容。因此,页面必须在物理上可用,内容才能在加载时立即出现。那么,如果我有pages/[id].js,并且每天都有内容添加到数据库中,那么物理内容文件应该如何自发地填充pages文件夹呢?如果不断创建pages文件,如何防止磁盘空间不足?我确信有些事情我不理解。

我在nextjs.org上读到,您可以有一个函数getStaticPaths,它需要返回"id"的可能值列表。我想知道,如果我的网站是实时的,并且新的内容(页面(不断地被添加到数据库中,并带有自己独特的id,这是怎么回事;意识到";那些id?我是否需要编写一个程序或消息队列系统,不断向getStaticPaths读取的文件添加新的ID?如果我必须在世界各地的多台服务器上复制我的网站,或者如果一台服务器失效,我是否必须跟踪文件的内容才能启动具有相同内容的新服务器?

据我所知,为了让谷歌在你的网站上看到任何类型的内容,页面文本(内容(需要是静态的,并通过物理文件快速可用。由于谷歌的爬虫主要关心文本,所以图像和其他一切都可以稍后加载。因此,如果每个帖子都需要是应用程序pages文件夹中的一个物理文件,那么如果将内容添加到数据库中,如何创建新的pages文件?

TL:DR我主要关心的是让我的内容可以随时用于谷歌爬虫,以便为我的网站获得好的分数。如果将内容添加到我的数据库中,我该如何实现这一点?

如前所述,您可以设置getStaticPaths以在构建时提供id的值列表。如果我理解正确的话,您最关心的是初始构建后添加的新内容会发生什么。为此,您必须从getStaticPaths返回fallback密钥。

如果回退密钥是false,那么最初未指定的所有ID都将转到404,并且每次添加新内容时都需要重新构建应用程序。这是你不想要的
如果将其设置为true,则初始值将像以前一样被预呈现,但新值将不会变为404。相反,访问具有新Id的路径的第一个用户将触发该新页面的呈现。这允许您在请求遇到构建时不可用的id时动态检查新内容。

有趣的是,当next.js处理请求时,第一个访问者将临时看到页面的"回退"版本。在回退时,通常只显示一个加载微调器。然后,服务器将数据传递给客户端,以便正确地呈现整个页面。因此,在实践中,用户首先会看到一个加载指示符,然后页面会用实际内容更新自己。后续访问者将立即获得现在预先呈现的结果。

你现在可能会担心爬虫会进入后备页面而无法获得SEO内容。这一问题已在这里得到解决:https://github.com/vercel/next.js/discussions/12482

除了能够在构建后提供新页面外,回退策略还有另一个用途,它只允许您预呈现网站的一小部分(如访问量最大的页面(,而其他页面将仅在必要时生成。

从文档来看:回退:真的有用吗?

您可以静态生成一小部分页面并使用回退:其他情况也是如此。当有人请求未生成的页面时然而,用户将看到带有加载指示符的页面。不多时之后,getStaticProps完成,页面将使用请求的数据。从现在起,每个请求相同页面的人都将获取静态预渲染的页面。这确保了用户在保持快速构建和静态生成的好处。

最新更新