如何使用输入文件保护/过滤HTML表单？

Question

我有一个包含2个输入的表单：

1. 从手机摄像头拍摄的文件，输入类型=“文件”

2. 短代码（6个字符的一次性，过期密码）

要求是1）验证短代码是否有效，2）如果是，则继续接收文件。

目前，在我的实现中，如果短代码无效，服务器仍会接收文件，将其编码为base64，将其作为隐藏表单字段返回给客户端，添加错误消息。

我不想暂时将文件保存在服务器上，因为它尚未获得授权。我将文件编码为base64 for UX，这样用户就不必再重复拍摄另一张照片的过程。他/她只需要重新输入短代码（希望这次是正确的代码）。另外，some version of Safari on iOS crashes because the huge base64 input hidden text。

问题：有哪些更好的选择：

1. 如果短代码无效，我不需要接收图像输入（出于安全考虑和节省带宽）？
2. 如果短代码无效，用户无需重新获取图像？

Answer 1

将图像保存在服务器上，为其提供ID，只需将ID发送回隐藏字段中的用户即可。服务器不是在服务器和客户端之间来回发送整个图像，而是可以保留图像，然后给客户端稍后再引用它。

此处需要注意的事项：

• id需要完全随机且不可取，否则客户端可能会欺骗服务器使用其他用户的图像
• 或者，如果您可以将上传与用户以某种方式关联起来（会话数据等）
• 由于用户可能在任何时候放弃该过程，您的服务器现在可能在磁盘上有一个永远不会被任何人使用的映像;您需要设置某种垃圾收集，以便定期删除任何已放弃的上传文件

Answer 2

如果密码不正确，为什么还要将文件发送到服务器？

您可以使用密码对服务器进行javascript ajax调用，以检查密码是否有效。如果它有效，那么来自ajax调用的回调可以提交包含input type =“file”的表单。

上传未经授权用户的文件可能会造成危险 - 至少浪费带宽。

<强> ADDED

不言而喻，您必须验证服务器端的所有内容，而不仅仅是客户端。

一个。您可以在发送文件的表单中再次包含密码。

B中。您的ajax请求可以使服务器端打开会话cookie 记住你是经过验证的（只要会话是开放的）。然后，当您使用文件提交表单时，服务器端验证只需检查您的会话。