I would like to detect the MIME type of a file on the client side of my application using jQuery or JavaScript. Is there a way to do this? Thanks.
我想使用jQuery或JavaScript检测应用程序客户端上的文件的MIME类型。有没有办法做到这一点？谢谢。
3 个解决方案
#1
31
You could use AJAX, make a HEAD request, and inspect the response headers for the Content-type header. But that only works if you're getting a file from a HTTP server.
您可以使用AJAX，发出HEAD请求，并检查Content-type标头的响应标头。但这只有在您从HTTP服务器获取文件时才有效。
To get the MIME type of a file chosen with an HTML file chooser, without submitting anything, try:
要获取使用HTML文件选择器选择的文件的MIME类型，而不提交任何内容，请尝试：
document.getElementById('fileChooserID').files[0].type // e.g. image/png
Example
例
http://jsbin.com/akati3/2
Try choosing an image, check the MIME type, and try to submit it. Then try something else that's not an image.
尝试选择图像，检查MIME类型，然后尝试提交。然后尝试一些不是图像的东西。
#2
4
The only way to reliably detect a mime type is to parse the file on the server side, to confirm that it is the type that the user claims it to be, or that it fits a list of allowed types. Things to consider:
可靠地检测mime类型的唯一方法是解析服务器端的文件，以确认它是用户声称的类型，或者它是否适合允许的类型列表。需要考虑的事项：
1 - JavaScript has limited access to the local filesystem, and with good reason.
1 - JavaScript有限制地访问本地文件系统，并且有充分的理由。
2 - You cannot trust a mime type which has been received from a browser. It will not necessarily match the mime type of the sent file.
2 - 您无法信任从浏览器收到的mime类型。它不一定与发送文件的mime类型匹配。
3 - In a situation where the user is allowed to upload files which fit a 'whitelist' of allowed types, validation is probably necessary anyway - considering that the application might have to actually do something with the file beyond storing them, which would at the very least involve parsing their headers for information such as run length (for a video) version number (for a Word document) and so on.
3 - 在允许用户上传符合允许类型的“白名单”的文件的情况下，无论如何都可能需要验证 - 考虑到应用程序可能必须实际对文件执行某些操作，而不是存储它们。至少涉及解析其标题以获取诸如运行长度（对于视频）版本号（对于Word文档）等信息。
#3
4
the idea IS NOT trust in the Browser..the idea is perform this validations on SERVER SIDE but, what a usefull thing if prior to send a 20MB file to the browser and next get rejected because a rule in the server...so, it is a good idea to "pre-check" if this file "is a candidate" to be uploaded, the final validation will be performed in the server.
这个想法是不信任浏览器..这个想法是在SERVER SIDE上执行这个验证但是，如果在将20MB文件发送到浏览器之前然后被拒绝因为服务器中的规则...那么，这是多么有用的事情...所以，最好“预先检查”该文件“是否是要上传的候选者”，最终验证将在服务器中执行。
#1
31
You could use AJAX, make a HEAD request, and inspect the response headers for the Content-type header. But that only works if you're getting a file from a HTTP server.
您可以使用AJAX，发出HEAD请求，并检查Content-type标头的响应标头。但这只有在您从HTTP服务器获取文件时才有效。
To get the MIME type of a file chosen with an HTML file chooser, without submitting anything, try:
要获取使用HTML文件选择器选择的文件的MIME类型，而不提交任何内容，请尝试：
document.getElementById('fileChooserID').files[0].type // e.g. image/png
Example
例
http://jsbin.com/akati3/2
Try choosing an image, check the MIME type, and try to submit it. Then try something else that's not an image.
尝试选择图像，检查MIME类型，然后尝试提交。然后尝试一些不是图像的东西。
#2
4
The only way to reliably detect a mime type is to parse the file on the server side, to confirm that it is the type that the user claims it to be, or that it fits a list of allowed types. Things to consider:
可靠地检测mime类型的唯一方法是解析服务器端的文件，以确认它是用户声称的类型，或者它是否适合允许的类型列表。需要考虑的事项：
1 - JavaScript has limited access to the local filesystem, and with good reason.
1 - JavaScript有限制地访问本地文件系统，并且有充分的理由。
2 - You cannot trust a mime type which has been received from a browser. It will not necessarily match the mime type of the sent file.
2 - 您无法信任从浏览器收到的mime类型。它不一定与发送文件的mime类型匹配。
3 - In a situation where the user is allowed to upload files which fit a 'whitelist' of allowed types, validation is probably necessary anyway - considering that the application might have to actually do something with the file beyond storing them, which would at the very least involve parsing their headers for information such as run length (for a video) version number (for a Word document) and so on.
3 - 在允许用户上传符合允许类型的“白名单”的文件的情况下，无论如何都可能需要验证 - 考虑到应用程序可能必须实际对文件执行某些操作，而不是存储它们。至少涉及解析其标题以获取诸如运行长度（对于视频）版本号（对于Word文档）等信息。
#3
4
the idea IS NOT trust in the Browser..the idea is perform this validations on SERVER SIDE but, what a usefull thing if prior to send a 20MB file to the browser and next get rejected because a rule in the server...so, it is a good idea to "pre-check" if this file "is a candidate" to be uploaded, the final validation will be performed in the server.
这个想法是不信任浏览器..这个想法是在SERVER SIDE上执行这个验证但是，如果在将20MB文件发送到浏览器之前然后被拒绝因为服务器中的规则...那么，这是多么有用的事情...所以，最好“预先检查”该文件“是否是要上传的候选者”，最终验证将在服务器中执行。