allowedMimeType check fails

[ZangulaLiron]

hey,

i'm using allowedMimeType and its i can upload png,jpg,jpeg and pdf images but i cant upload word files : doc,docx excel files: xls,xlsx and power point files : ppt, .pps, pptx, ppsx

i added the correct mime types to all this files :

uploader: FileUploader = new FileUploader({
    url: `${this.url}support/upload-image`,
    autoUpload: true,
    headers: [{ name: 'x-auth-token', value: this._authService.getToken() }],
    allowedMimeType: ['image/png', 'image/jpg', 'image/jpeg', 'application/pdf',
      'application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
      'application/ms-doc', 'application/doc',
      'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
      'application/vnd.ms-powerpoint', 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
      'application/application/vnd.openxmlformats-officedocument.presentationml.slideshow'
    ],
    maxFileSize: this.totalSize
  });

constructor(private _supportService: SupportService,
    private _authService: AuthService
  ) {
    this.uploader.onWhenAddingFileFailed = (fileItem, filter) => {
      console.log(filter);
      if (filter.name = "mimeType") {
        alert('Uploaded file is not supported, this are the supported files : pfd, jpg, png, jpeg ,docx , doc, xlsx, xls, ppt, pps, pptx, ppsx');
      }
    }
}

i tried to add all the doc, excel and powerpoint files and im getting the mimeType error :

[ghost]

Even though this package seems pretty abandoned I thought I might comment on what I found out in case some other people come across this problem. I believe this is the same issue as #947.

It looks like the problem is how the <input type="file"> tag handles .doc files. If you check the onchange event on this tag, you can see it automatically sets an "input" property with the correct mimetype for most file types (e.g. "file.jpg" gets the type "image/jpeg"), but it leaves this field blank if you try uploading .doc files.

Ng2-file-upload gets the uploaded file's mimetype from this "type" field set by this html tag. However, as this is blank for .doc files, it's not able to set the file's mimetype as "application/msword" as it should, and therefore is also not able to filter it with the allowedMimeTypes tag.

If you want to fix this locally while it isn't fixed in the package itself, one quick workaround is to just change the "_createFromObject" function in the "file-like-object.class.js" from:

this.size = object.size;
this.type = object.type;
this.name = object.name;

to:

this.size = object.size;
this.name = object.name;
if (object.type != '') {
   this.type = object.type;
} else {
   var chunks = object.name.split('.');
   if (chunks[chunks.length - 1].toLowerCase() == 'doc') {
   this.type = 'application/msword';
}

The ideal fix would be to make this more generic so it works for every file type that is not correctly identified by the input tag, but as I only saw this bug happen with .doc files I left it at just that.

[jgonzalez4gcp]

In case Windows 10 stores mime types on Registry, and Mozilla File API (FileLikeObject) return different mime types depending on OS even some files like .rar return with empty mime type.

So is non deterministic the mime type filtering using same file on different machines.

https://textslashplain.com/2018/07/26/be-skeptical-of-client-reported-mime-content-types/

[ammad172]

well i am also using ng2 fileupload and whenever i am trying upload Docx file. The control is not returning any content length or binary of this file type. But working fine with pdfs and jpg stuff. I wonder when they will fix this so we can upload Doc and Docx files