Published at 2 years ago

关于NextJs静态文件再生成问题

这段时间在玩nextjs，生产发布时发现想实现ssr并且动态获取数据并增加静态页面文件；

了解到了next的ISR（Incremental Static Regeneration）方案：增量静态再生成，运行时定期重新生成静态 HTML；

现在基本可以实现静态文件生成，且能定期获取动态数据；

但是有个问题，我在地址栏内输入一个随意的id也会自动生产一个我不需要的静态文件，看图

我在想，如果有人恶意输入，无限在地址栏输入，导致我生产了很多无效静态文件，这是不是很危险；

我发现咱hackertalk也可随意输入url的id，就不知道会不会在服务器内产生相应的无效文件

站长 Superman 大佬，你这块怎么解决的呢？

next.js·javascript

205 views

Comments

登录后评论

yellow star

·2 years ago

哈哈，能否加一个 @ 某某的功能，好想@大佬看看

HD Superman

·2 years ago

这个不会，因为黑客说现在不是 nextjs 那种服务端渲染。

要做的更安全（我不是专业的），每个输入都要检查，可以对于找不到的 post 统一给一个 not found 页面。

服务端生成静态文件的操作，可以对请求频率进行限制，避免被爆刷导致产生大量无效文件，静态文件可以放对象存储（成本低、无限容量），可以缓解类似攻击带来的问题。

yellow star

·2 years ago

重新回去看了一下官方文档，原来是给了解决方案的，是我菜了，文档都看不明白，

利用getStaticProps 返回值 notFound属性，加个if校验，数据库若没对应数据的话可以不生成静态文件

export async function getStaticProps(context) {
  const res = await fetch('http://localhost:3030/api/msq/search?id='+context.params.aid)
  const result = await res.json()
  //判断后端数据是否存在，不存在不生产页面
  if (!result.success) {
    return {
      notFound:true,
      revalidate: 10,
    }
  } 
  return {
    props: {
      datas:result.data,
    },
    revalidate: 10,
  }
}