2

How to validate the content-type of a file before uploading using JavaScript? I'm not asking the extension validation. I want to validate pdf,plain text and MS word files.

I'm using a django forms.ModelForm to pass file upload widget to html. I couldn't achieve this either on server side. Here is that question,

Django - Uploaded file type validation

Improve this question
2
  • are you asking how to identify the file type on the client - before it is sent to the server? Commented Aug 2, 2012 at 8:26
  • Yes, but I'm aware about the extension validation. Commented Aug 2, 2012 at 8:41

2 Answers 2

Reset to default
2

Maybe but it won't give you any form of security because an attacker could use other means to upload files thus circumventing your validation.

To check the file type using the extension (which is very insecure since it's dead easy to manipulate it), you can use JavaScript. See this question: How do I Validate the File Type of a File Upload?

[EDIT] After some googling, I found that the input element has an attribute accept which takes a list of mime type patterns. Unfortunately, most browsers ignore it (or only use it to tweak the file selection dialog). See this question: File input 'accept' attribute - is it useful?

[EDIT 2] Right now, it seems that the File API (see "Using files from web applications") is your only way it you really don't want to use file extensions. Each File instance has a type property which contains the mime type.

But this API is work in progress, so it's not available everywhere. And there is no guarantee that you'll get a MIME type (the property can be "").

So I suggest this approach: Try the File API. If it's not available or the type property is empty, use the file extension.

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Presumably, like all client side validation, the purpose is not to be secure but to save the user from uploading a (potentially large file) only to have it rejected.
The question explicitly rejects file extension checking.
IIRC, implementations of the accept attribute are usually based on the file extension.
1. There doesn't seem to be a way to do it without using the file extension. 2. The server can read the first few KB of the file, analyze them and reject them (close channel). Most server frameworks don't support this out of the box but it's possible.
2

In theory you could use the File API to read the files.

You would then need to write parsers in JavaScript for the file formats you cared about to check if they matched.

Improve this answer

4 Comments

Note: You don't have to parse the file; if you have a File object, you can read it's type attribute: developer.mozilla.org/en/Using_files_from_web_applications That said, the File API is HTML 5 and work in progress.
@AaronDigulla — That requires trusting the browser to correctly determine the file type. I'd expect browsers to ask the underlying OS and Windows (at least) to use the file extension.
@Quentin: Even if you try to parse the files, an attacker could easily circumvent this by uploading using a command line tool. So no matter how you do it, it's going to be a weak defense which leads to the question how much effort you should spend on it.
@AaronDigulla — See my first comment on your answer.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.