html - 我接受 : accept ="image/gif, image/jpg, image/jpeg, image/png", 的输入文件允许选择其他扩展名

Question

我有一个用于为画廊选择图像的表单，我希望允许用户仅选择 jpg、gif 和 png 图像格式。

现在，为了测试，我将图像的扩展名更改为 .bmp，例如“image1.bmp”，当我在输入文件中单击以选择图像时，这个“image1.bmp”是隐藏的，但是如果我选择“显示所有文件”，出现这个“image1.bmp”，我可以选择这个“image1.bmp”并在我的表格中发送这个图像。我将这种格式的图像插入到数据库中。

这是正常使用 accept="image/gif, image/jpg, image/jpeg, image/png"??

因为我想要的是阻止所有不是 gif、jpg 或 png 的格式。

我有这个输入文件:

<input type="file" name="img[]" multiple="multiple" accept="image/gif, image/jpg, image/jpeg, image/png" />

Answer 1

这是常见的浏览器行为。支持 accept 属性的浏览器使用它来创建一个初始文件过滤器，但它们不会阻止用户更改或删除过滤器，从而选择和提交他们想要的任何文件喜欢。该属性的目的是帮助用户选择合适类型的文件。

浏览器应该做什么还不太清楚。 HTML 4.01 says accept 属性“指定一个以逗号分隔的内容类型列表，处理此表单的服务器将正确处理这些内容类型。当提示用户选择要发送到服务器的文件时，用户代理可能会使用此信息来过滤掉不符合要求的文件”。对服务器端处理的引用可能会产生误导。该属性仅影响客户端(浏览器)行为。其目的是说应该根据用户期望的文件类型写入属性值；不言自明的是，应该编写服务器端表单处理程序，使其能够处理指定的类型。

HTML5 LC更冗长。它说该属性“可以指定为用户代理提供将接受哪些文件类型的提示”。然后它描述了浏览器如何使用它来提供足够的用户界面。它还说:“用户代理应该阻止用户选择这些 token 中的一个(或多个)不接受的文件。”这可能是明智的，但浏览器实际上并没有这样做。即使他们这样做了，该属性也不会构成任何类型的安全措施(因为用户可以编辑表单，或编写自己的表单，或使用忽略 accept 属性的浏览器) .其目的是防止普通用户犯错误，例如提交将被服务器端处理程序拒绝的类型的文件。

(浏览器以相当简单的方式解释 accept 属性值。它们处理文件扩展名，因此如果您命名 GIF 文件、纯文本文件或二进制程序文件，那么它名称以 .png 结尾，他们会将其视为 PNG 图像文件，而不是检查文件的内容。.bmp 扩展名有问题，因为它通常表示 Windows 位图，没有注册的 MIME 类型；浏览器可能将非标准符号 image/bmp 视为对应于 .bmp。)

您不能阻止发送 文件。你可以做的是在服务器端正确处理文件，当然你不应该依赖文件扩展名，而是从文件内容中检测类型。