1

我正在构建一个传统的服务器渲染 HTML 应用程序（在 PHP 之上使用Statamic），它可以让用户创造想法。他们访问 Create Idea 表单，填写一些问题，然后单击提交。一旦他们这样做了，表单就会向POST服务器发送一个请求，然后服务器会保存数据，为这个想法生成一个 ID（和 slug）。

我现在想让用户上传文件作为他们想法的一部分。当然，执行此操作的老式方法是将文件输入添加到表单中，然后一次性提交所有内容（数据和文件）。服务器可以创建一个 ID，然后将文件与该 ID 相关联。

但是，这种方法有一些缺点，尤其是在表单提交过程中必须等待文件上传的延迟。更现代的实现似乎会在添加文件后立即上传文件（例如，通过拖放）。例如，我已将FilePond确定为领先者，否则我可能会使用Dropzone.js。

但是，如果浏览器在用户提交表单之前发送文件，我怎样才能最好地将文件与表单数据相关联？我还没有要使用的 ID。

这一定是一个已解决的问题。但我无法通过谷歌找到任何最佳实践，因此这个问题。我想到的可能解决方案：

  1. 生成 GUID 作为表单的一部分。与任何文件上传一起提交。如果最终提交表单，请将其保存（作为隐藏字段）作为表单数据的一部分。
  2. 要求用户在启用文件上传之前提交表单（保存草稿）。显然不是很好的用户体验。
  3. 作为上述 2) 的变体，在用户开始上传文件之前的某个时间点通过 Ajax 自动提交表单。

我倾向于解决方案 1，但想看看我可能没有想到的。2 不是很好，因为 UX 令人困惑，而 3 似乎也不太理想，例如因为我最终可能会保存用户从未真正保存自己（并放弃）的草稿，部分原因是生成的 slug 可能是基于丢失或不完整的标题，因为用户在上传文件之前可能没有完成标题字段。

4

2 回答 2

2

这是我的建议：

  • 立即上传文件（验证后..）
  • 在数据库的“文件”表中创建一个条目，第一个是路径/文件名（使其唯一！），第二个是唯一的，足够长的令牌
  • 将其发送回您的表单（作为上传返回）和
  • 将其与隐藏输入中的表单一起提交。

然后创建一个 cronjob，每隔一小时左右删除一次所有未使用的文件。

于 2018-05-29T22:27:23.990 回答
0

事实上，FilePond 的文档有一个推荐设置的描述：

使用 FilePond 异步上传文件称为处理。简而言之，FilePond 向服务器发送一个文件，并期望服务器返回一个唯一的文件 id。然后，此唯一 ID 用于恢复上传或稍后恢复较早的上传。

随着时间的推移描述的上传过程：

  1. 客户端使用 POST 请求将文件 my-file.jpg 上传为 multipart/form-data
  2. 服务器将文件保存到唯一位置 tmp/12345/my-file.jpg
  3. 服务器以文本/纯文本响应返回唯一位置 ID 12345
  4. 客户端将唯一 ID 12345 存储在隐藏的输入字段中
  5. 客户端提交包含具有唯一 ID 的隐藏输入字段的 FilePond 父表单
  6. 服务器使用唯一 ID 将 tmp/12345/my-file.jpg 移动到其最终位置并删除 tmp/12345 文件夹
于 2018-06-04T16:20:10.577 回答