How To Modifying The Filename Before Uploading When Using Meteor Edgee:SlingShot Package

Question

Please i am trying to modify the filename of a selected file posted by a user before uploading to Amazon S3 using the edgee:slinghot package. I can upload the file quite alright but the problem is how do i modify the filename. I modified it on the client using by saving the modified name into a variable. My problem now is how to access that variable declared and saved on the Client in the Server environment. I just can't seem to wrap my head around it.

    'change .js-submitTeamPaper' : function(event , template){

       event.preventDefault();
       let paper = template.paperDetails.get();
       newFilename = paper[0].paper_name + "_"
       _.map(paper[0].member , (member)=>{
        newFilename +=  "_" + member.regnum + "_"
      });
      newFilename += paper[0]._id;
      let file = event.target.value;
      let fileArray = file.split(".");
      let ext = fileArray[fileArray.length - 1];
      newFilename += "." + ext;

   studentFileUpload(event , template , 'submitTeamTermPaper' ,  'divProgress');

    }

The code to upload the file.

 let _collectfile = (event , template) =>{
    let file = event.target.files[0]
    return file
  }

  let _showProgressBar = (div) => {
    let _div = document.getElementById(div);
   _div.classList.remove("hide");
  }

 let _closeProgressBar = (div) => {
   let _div = document.getElementById(div);
  _div.classList.add("hide");
 }

  let _slingShotUploadConfigure = (event , template , folder ,div) => {
      let _upload = new Slingshot.Upload(folder);
      let _file = _collectfile(event , template);
      _showProgressBar(div);
      _upload.send(_file , (error , downloadUrl) => {
     template.uploader.set();
      if (error){
        //throw new Meteor.Error('500' , error.reason);
        event.target.value = '';
        sAlert.error(error.reason , {effect: 'bouncyflip',
        position: 'bottom-right', timeout: 3000, onRouteClose: false, stack: false, offset: '150px'});
        _closeProgressBar(div);
     }
     else{
       sAlert.success('File was uploaded successfully' , {effect: 'genie',
       position: 'bottom-right', timeout: 3000, onRouteClose: false, stack: false, offset: '150px'});
       event.target.value = '';
       template.downloadUrl.set(downloadUrl);
       _closeProgressBar(div);
       //return downloadUrl;
     }
 });
 template.uploader.set(_upload);

}

 export default function(event , template , folder ,div , progress){
   return _slingShotUploadConfigure(event , template , folder,div , progress)
 }

I then imported the module as studentFileUpload from '../../modules/handle-fileuploads'; Below is the meteor-slingshot code to do the upload

   Slingshot.createDirective("submitTeamTermPaper", Slingshot.S3Storage, {
     bucket: Meteor.settings.BucketName,
     AWSAccessKeyId : Meteor.settings.AWSAccessKeyId,
     AWSSecretAccessKey : Meteor.settings.AWSSecretAccessKey,
     acl: "public-read",

     authorize: function () {
     // do some validation
     // e.g. deny uploads if user is not logged in.
       if (this.userId) {
         return true;
     }
   },

   key: function (file) {
   //file here is the file to be uploaded how do i get the modified file name i defined in the client as newFilename here
   let timeStamp = + new Date;
//let newFilename = file.name.replace(/_/g , "-");
return  'Team_Term_Papers/' + timeStamp + '_' + '_' + newFilename;

} }); From my code newFilename is the variable that holds the modified filename. How do i access it from the server environment. Any help is really appreciated. Thanks

Answer 1

You can pass extra information through to slingshot using metacontext:

metacontext = {newName: "foo"};
let _upload = new Slingshot.Upload(folder,metacontext);

Then you can access that metacontext in your key function:

key: function (file,metacontext) {
  let timeStamp = + new Date;
  let newFilename = metacontext ? metacontext.newName : file.name;
  newFilename = newFilename.replace(/_/g , "-");
  return  'Team_Term_Papers/' + timeStamp + '_' + '_' + newFilename;
}