CODEWITHSUNDEEP
javascriptvalidation
Nasaf
Nasaf

Reputation: 45

How to validate a file upload field using Javascript/ google App script

All

I have been stuck on my simple project for while now. I have created a web app code that allows others to upload their pdf file to my google folder but the problem that I could not figure out who to set specific file extension so other do not upload only accepted extension "pdf". inside my code, there is a function supposed to prevent any type of extension except for pdf but it did not work.

    <form>
        <input type="file" name="myFile" accept= "checkfile(sender);" id='file' >
        <br>
        <br>
        <input type="button" id="submitBtn" value="Upload Files">
        <label id="resp"></label>
    </form>
    <script>
      document.getElementById('submitBtn').addEventListener('click',
        function(e){
          google.script.run.withSuccessHandler(onSuccess).uploadFiles(this.parentNode)
        })
        
        function onSuccess(data){
          document.getElementById('resp').innerHTML = "File Uploaded to the path " +data;
          
          
          function checkfile(sender) {
    
   var element=  document.getElementById('file')
   if ( sender !== '.pdf') {
   
   return sender.preventDefault(); 
   } else {
   
   return true; 
   }
}
        }
       
    </script>

code.gs

 function doGet() {
  var html = HtmlService.createHtmlOutputFromFile('form');
  return html.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}


function uploadFiles(data)
{
 var file = data.myFile;
 var folder = DriveApp.getFolderById('...........');
 var createFile = folder.createFile(file);
 return createFile.getUrl();
}

Upvotes: 1

Views: 466

Answers (2)

skaarj
skaarj

Reputation: 100

  1. Use accept in <input> <input type="file" accept=".pdf"/>
  2. Add server side validation for extension
function uploadFiles(filename, data) {
  if (!!filename.match('^.*\.(pdf|PDF)$')) return false; // or throw error
}

Upvotes: 3

zackcpetersen
zackcpetersen

Reputation: 81

Looks like you're trying to match the filename with just ".pdf" - You could try using regex to match to only the end of the file.

const regex = "^.+\.pdf$"
if (!sender.match(regex)) {
    return sender.preventDefault();
}

Upvotes: 1

Related Questions