How to Send the uploaded file to Apex using lightning:fileUpload - Salesforce lightning

Question

After the Alert how do I retrieve the files that were uploaded and send them to the Apex class?

Also on the APEX class what is the input parameter type we use for receiving the file sent?

Component Code

<lightning:fileUpload label="Upload Multiple files" 
                               multiple="false" 
                              accept=".pdf, .png, .jpg"
                              recordId="{!v.recordId}"
                              aura:id="multipleUpload"
                             onuploadfinished="{!c.handleUploadFinished}" />

JScontroller

({
    handleUploadFinished: function (component, event, helper) {
    // Get the list of uploaded files
    var uploadedFiles = event.getParam("files");
        alert("Files uploaded length  : " + uploadedFiles.length);
      }    
})

Answer 1

Please review the documentation:

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/aura_compref_lightning_fileUpload.htm

The lightning file upload component, uploads files and attaches it to a record.

You specify the record to attach the files to with the below attribute:

recordId => String => The record Id of the record that the uploaded file is associated to.

If you want to validate the files or have some logic to execute on them, use the below callback function provided:

onuploadfinished => Action => The action triggered when files have finished uploading.

The docs show this example of a callback function:

({
    handleUploadFinished: function (cmp, event) {
        // Get the list of uploaded files
        var uploadedFiles = event.getParam("files");
        alert("Files uploaded : " + uploadedFiles.length);
    }
})

As you can see the function receives an event called files that can be inspected.

Answer 2

instate of sending docId you can send file in string form using JSON.stringify(uploadedFiles[0])

    ({
     handleUploadFinished: function (component, event, helper) {
     var uploadedFiles = event.getParam("files");
     var action = cmp.get("c.saveDoc");
     action.setParams({
          parentId : cmp.get("v.myRecordId"),
          contentDocId : uploadedFiles[0].documentId
      });


      action.setCallback(this, function(response) {
         var state = response.getState();
         if (state === "SUCCESS") {

            var toastEvent = $A.get("e.force:showToast");
            toastEvent.setParams({
                "title": "Success!",
                "message": "File "+uploadedFiles[0].name+" Uploaded successfully."
            });
            toastEvent.fire();
            var cmpEvent = cmp.getEvent("cmpEvent");
            cmpEvent.fire();
          }
          else {
            console.log("Fail");
          }

         });
         $A.enqueueAction(action);
          }
         })