5

I use library Angular File Uploader in Angular JS. Here are filters thats allow to set files types to uploading. I do it like as:

uploader.filters.push({
    name: 'imageFilter',
    fn: function (item /*{File|FileLikeObject}*/, options) {
    var type = '|' + item.type.slice(item.type.lastIndexOf('/') + 1) + '|';
         return '|doc|txt|docx|xml|pdf|djvu'.indexOf(type) !== -1;
   }
});

Problem is that user can change extension file, for example change *.exe to *.pdf and after Angular uploader will add file to queue upload.

And how I can show information in template where is PDF and txt file?

Improve this question
4
  • There is no true way to validate a file on the client side, as the user can easily "trick" the system through disabling JavaScript, removing the accept attribute from the input, etc. Commented May 10, 2015 at 14:59
  • What you can propose? Commented May 10, 2015 at 15:03
  • 1
    I would have a PHP backend file validation (stackoverflow.com/questions/310714/…), and have the accept attribute accept only the file types you want (w3schools.com/tags/att_input_accept.asp). Commented May 10, 2015 at 15:14
  • People still (willingly) use PHP? Commented Jul 31, 2019 at 21:46

1 Answer 1

Reset to default
1

You've identified one of the major concerns with uploading files to a server (congratulations!) :)

All joking and flippancy aside, I haven't heard of an elegant or sure-fire way to validate files with AngularJS before upload (as you know, AngularJS is limited by the APIs that JavaScript natively provides, since AngularJS is a JavaScript framework.)

As this answer to "How to check file MIME type with javascript before upload?" points out, you can check the MIME type of a file on the client before uploading.

However, there are limitations to checking files on the client for many reasons, including:

  1. The user can change information about the file (for example, as you pointed out, the extension name)
  2. Some browsers have limited support for the APIs that might enable you to check files in the first place on the client

That's why your best bet is to check files on the server.

One method (among the probable many) is to use PHP, and do something similar to what this answer to "How to check file types of uploaded files in PHP?" suggests, which is:

Take a look at mime_content_type or Fileinfo. These are built-in PHP commands for determining the type of a file by looking at the contents of the file. Also check the comments on the above two pages, there are some other good suggestions.

Personally I've had good luck using something that's essentially system("file -bi $uploadedfile"), but I'm not sure if that's the best method.

The advantage of relying on the server (instead of the client) to check files is you are only limited by the APIs that your server can utilize (which the client user has no control over).

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

Comments

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.