当前位置: 首页 > Web前端 > HTML

上传输入文件的一些小技巧

时间:2023-04-02 22:00:28 HTML

在我们日常的开发中,都绕不开上传文件的功能。有时候上传文件的时候需要限制,比如下面这个例子:1.不限制代码如下:点击后会显示:2.只能上传图片,指定格式为png代码如下:点击后显示:OK,筛选完成。但是这个接受是什么?答案是MIME。MIME(多用途Internet邮件扩展)是一种用于描述邮件内容类型的Internet标准。MIME消息可以包含文本、图像、音频、视频和其他特定于应用程序的数据。完整的MIME参考手册,点这里3.指定上传“.apk”文件,本来以为解决了文件屏蔽的问题,但是在前几天的一个需求中,就离谱了。需求如下:需要两个不同的终端来限制不同类型文件的长上传。终端类型1只能上传“.zip”文件,终端类型2只能上传“.apk”。看到这里,有朋友会问了,有什么离谱的,去MIME手册上查一查就完事了。我也是这么想的,然后我去看了参考手册,发现里面没有“.apk”的MIME类型。该怎么办?总有办法。首先我们想到的是获取文件名,利用文件扩展名进行过滤://js代码函数file(){constfileName=document.getElementById('fileField').files[0].名字;consttempArr=fileName.split('.');const后缀=tempArr[tempArr.length-1];控制台日志(后缀);//apk}好了,现在我们可以获取文件扩展名,然后判断相关文件是否满足上传要求,并在上传前给服务器提示信息,让它上传符合条件的文件。但是总觉得这样很不协调,不太友好。所以再考虑一下。毕竟“.apk”文件太常见了,MIME类型没有这个就有点不合理了。这时,万能的网友就派上用场了~在扩展名中填写“.apk”。在MIME类型中填写apk的MIME类型application/vnd.android.package-archive,快速添加试试:结果达到了我们的预期,哎呀~4。需要注意的是,当然还要加上我们的扩展验证。另外,必须在服务器上验证上传文件的类型!!!上面的accept方法其实归根结底只是一个建议,可以帮助我们快速筛选出某个文件夹中符合条件的文件,但是我们还是可以点击上图的右下角,然后点击所有文件,这样其他类型的就可以了也可以选择文件。