如何以编程方式调用 React Server Actions（在 Next.js 14 中）来模拟速率限制？

Question

我有一个

signup

操作，它使用

email

将

FormData

作为表单输入并向数据库添加值。

我想仅使用

fetch

api 来模拟速率限制。我怎样才能做到这一点？

我不想使用剧作家或通过另一个按钮在浏览器中模拟 100 个请求。

我只想使用

fetch

。技术上可行吗？

我尝试使用以下代码：

async function main() {
  const formData = new FormData()
  formData.append('email', '[email protected]')

  const res = await fetch('http://localhost:3000/signup', {
    method: 'POST',
    body: formData,
  })

  const data = await res.json()

  console.log({ data })
}

main()

并在终端中输入

tsx ./rate-limit/signup.ts

。

但它只给了我 html。

好奇是否有可能像

/api

路线那样？

Answer 1

您必须提供

Next-Action

标头：

 const res = await fetch('http://localhost:3000/signup', {
    method: 'POST',
    body: formData,
    headers: {
        'Next-Action': '0917c6804f07eaf34c42aa6867f90bf00983db90' // <-- Replace with your action id
    }
  })

我没有找到如何自动获取此操作 ID，但您可以通过检查浏览器开发工具的网络选项卡中的请求标头来手动获取它。