Merge pull request #608 from cagdas001/fix-269

fix(upload): add mime-type check at file uploads

Author: callmekatootie

client/src/components/Upload/Initial/index.jsx

@@ -40,14 +40,15 @@ export default function Initial({ onError, onUpload, templateId }) {
   };
 
   const upload = (files) => {
-    const allowedMineTypes = [
-      "application/vnd.ms-excel",
-      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
-      "text/csv",
-    ];
-    if (files && files[0] && allowedMineTypes.indexOf(files[0].type) !== -1)
-      onUpload(files[0]);
-    else setInvalidFileExtension(true);
+    const allowedExtensions = ["xls", "xlsx", "csv"];
+    if (files && files[0]) {
+      const ext = files[0].name.split(".").pop();
+      if (allowedExtensions.includes(ext.toLowerCase())) {
+        onUpload(files[0]);
+      } else {
+        setInvalidFileExtension(true);
+      }
+    }
   };
 
   let contentStyle = style.content;
@@ -85,6 +86,7 @@ export default function Initial({ onError, onUpload, templateId }) {
             onChange={(e) => upload(e.target.files)}
             ref={fileInputRef}
             type="file"
+            accept=".xls,.xlsx,.csv"
           />
           <img src={spreadsheetIcon} alt="icon" />
           <div className={style.label1}>
@@ -99,7 +101,11 @@ export default function Initial({ onError, onUpload, templateId }) {
             </span>
           </div>
           <div className={style.label2}>Supports XLS, XLSX or CSV file</div>
-          <div className={style.label3} onClick={downloadTemplate} disabled={isDisabledDownload}>
+          <div
+            className={style.label3}
+            onClick={downloadTemplate}
+            disabled={isDisabledDownload}
+          >
             Download Import Template (.XLSX)
           </div>
         </>

package-lock.json

@@ -30,6 +30,7 @@
     "dynamoose": "^1.8.0",
     "express": "^4.17.1",
     "express-interceptor": "^1.2.0",
+    "file-type": "^14.6.2",
     "get-parameter-names": "^0.3.0",
     "http-status-codes": "^1.3.0",
     "js-yaml": "^3.14.0",

package.json

@@ -5,9 +5,33 @@ const _ = require('lodash')
 const Joi = require('joi')
 const config = require('config')
 const { v4: uuid } = require('uuid')
+const FileType = require('file-type')
+const errors = require('../common/errors')
 const helper = require('../common/helper')
 const logger = require('../common/logger')
 
+/**
+ * Checks the type of uploaded file and ensures it's allowed.
+ * @param {Object} upload The uploaded file
+ */
+async function ensureFileTypeIsValid(upload) {
+  const allowedExtensions = ['xls', 'xlsx', 'csv']
+  const allowedMimeTypes = [
+    'application/vnd.ms-excel',
+    'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+    'text/csv',
+  ]
+  const fileType = await FileType.fromBuffer(upload.buffer)
+  const fileExt = upload.originalname.split('.').pop().toLowerCase()
+
+  const isValidMimeType = fileType && _.includes(allowedMimeTypes, fileType.mime)
+  const isValidExt = _.includes(allowedExtensions, fileExt)
+  const isAllowed = fileType !== undefined ? isValidMimeType : isValidExt
+  if (isAllowed === false) {
+    throw new errors.ForbiddenError(`You are allowed to upload only ${_.join(allowedExtensions, ',')} types.`)
+  }
+} 
+
 /**
  * Get upload entity by id.
  * @param {String} id the upload id
@@ -31,6 +55,7 @@ getEntity.schema = {
  * @returns {Object} the created upload
  */
 async function create (authUser, upload, data) {
+  await ensureFileTypeIsValid(upload)
   const id = uuid()
   // upload file to s3 under uploads folder
   const objectKey = await helper.uploadToS3(config.UPLOAD_S3_BUCKET, upload, `uploads/${id}`)