用户进行文件更改时,FileAPI不会更新文件大小(非webkit浏览器)
Jay*_*com 8 javascript firefox html5 webkit fileapi
我想我先用一个例子来证明这个问题,
jsfiddle:http://jsfiddle.net/e2UfM/15/ (经FF 12测试,Chrome 18.0.1025.168测试)
用法:
- 从本地计算机加载文本文件.
- 点击"加载文件".
- 点击"显示文件大小" - 记下大小.
- 修改并保存本地计算机上的文本文件.
- 再次点击"显示文件大小".请注意在webkit浏览器(Chrome)中文件大小如何变化,但在Firefox中它没有更新文件大小
当用户对他们选择的本地文件进行更改时,非webkit浏览器不会更新其大小属性,而Chrome则会更新.两个浏览器都会更新文件的内容.
有没有办法让Firefox更新文件大小,类似于Chrome在这种情况下的工作方式？
简单的真实世界示例:
用户选择一个对于表单来说太大的文件,他们点击提交按钮并收到他们的文件太大的通知(通过警报,"大小"栏(见下文)等)
他们在本地修改文件,然后再次点击提交.
在Chrome中,文件大小会更新.当用户再次点击提交按钮时,它将再次验证其更新大小并允许上传.在Firefox中,用户必须先重新选择表单上的文件才能看到文件大小发生变化.
Firefox的部分解决方法 - @ ZER0的答案
真实世界的例子(深入):
File API的一个目的是在上传到服务器之前验证客户端的文件大小,如果我没有弄错的话.
考虑表单中存在2MB上载限制并且用户选择1MB文件的情况.Firefox和Chrome都会看到文件大小小于2MB并将其添加到表单中.我们还要说有一个简洁的条形图显示它们选择了多大的文件,以及它是否会影响文件大小限制:
但是,然后用户决定在提交表单之前在本地对该文件的内容进行微小更改,并将大小超过2MB.
在Google Chrome中,我可以在客户端优雅地处理此问题.我可以在用户提交表单时再次检查文件大小,并在将其发送到服务器之前验证它实际上仍然低于1MB.但即使在用户提交表单之前,在Chrome中,我可以动态更新小条形图,因为它们在本地进行更改:
如果用户填写大型表单,则此"条形"(或即时通知上的任何其他形式,例如警报)非常有用.我希望用户立即知道他们的文件太大,以便他们可以更正它,而不仅仅是当他们提交表单时.
在Firefox中,因为文件大小永远不会更新,所以很乐意上传2MB文件,认为它仍然是1MB!我使用服务器端逻辑来仔细检查文件大小,但我宁愿保存服务器之旅.
我是如何遇到这个错误的:
以上示例适用于更多人,因为更多人可能已经处理了表单中的文件上传与使用File API中的切片功能.这是我遇到问题的具体方式.
在我的表单中,用户选择一个文件,当他们点击提交时,屏幕上只显示最后10,000个字节,textarea以确认它确实是他们想要的文件.
考虑一个大小为50,000字节的文件.用户在表单中选择它,Chrome和Firefox都显示字节40,000 - 50,000中的字节textarea.
现在,用户将一些内容添加到文件中,并将相同的文件碰到70,000字节!
谷歌浏览器将正确更新textarea包含字节60,000-70,000.在Firefox中,因为大小将保持不变,所以它仍然只显示该范围内的字节40,000-50,000.
编辑:更新了jsfiddle以演示FF仍然可以读取更新的文件内容.只是文件大小不会随着这些新内容而改变.
编辑: https ://bugzilla.mozilla.org/show_bug.cgi？id = 756503(错误报告)
| 归档时间： |
|
| 查看次数： |
437 次 |
| 最近记录： |