静态网站、文件上传和重新验证

时间:2020-12-31 13:38:38

标签: forms nuxt.js recaptcha

我只是在想最好的方法是在没有任何后端的静态网站上实现一个带有文件上传的简单表单。

场景:

我有静态网站 (NuxtJS),可以在其中填写表单并上传文件。 为了保护这个表单,我想使用 Google 的 recaptcha,但是当我在他们的文档中进一步阅读时,似乎我需要一个后端,这对于静态网站来说是一种矫枉过正。 此外,我想支持文件上传......没有后端就相当复杂。

我的想法:

也许现有的产品完全符合我的要求?或者我应该构建一个 AWS Lambda 管道(当然使用 S3 存储桶)作为我的“后端”来进行重新验证和文件上传。 有没有什么方法可以让这个场景更简单,或者我现在想复杂化。

用例/流程图:

  1. 用户进入网站。
  2. 填写表格。
  3. (可选)上传文件
  4. 检查重新验证
  5. 点击发送 - 在我们公司的空闲渠道/或电子邮件中发送“消息”。

1 个答案:

答案 0 :(得分:1)

但是,我使用托管在 AWS Lambda 上的自定义“后端”解决了这个“常见”任务,这使得整个内容“无服务器”。

对于那些对“如何设置无服务器后端”感兴趣的人,这里是我使用的当前流程图。

enter image description here

如您所见,在客户端验证 recaptcha 并生成令牌后,它被发送到 AWS API 网关,该网关触发 Lambda 函数(后端的 NodeJS 实现),在那里验证令牌并用于文件上传生成预签名的 Uris。 注意:API 网关和 S3 存储桶需要有效的 CORS 配置才能相互通信和与世界通信。