function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Muzammil BajariaMuzammil Bajaria 

uploading file in contentVersion using lightning component

Hi,
I am developing a lightning component to upload file in contentVersion object. I am refering to this site : 
http://webcache.googleusercontent.com/search?q=cache:yDEYXecmDHMJ:peterknolle.com/file-upload-lightning-component/+&cd=1&hl=en&ct=clnk&gl=in

I was successful uploading files upto 3 MB without chunking but I am facing some issue in chunking the file to upload the large files.
Wherever i upload the file , it gives me following error :
System.StringException: Unrecognized base64 character: %
I am attaching code for helper class and apex controller.

Helper Class :
({
    MAX_FILE_SIZE: 4 500 000, /* 6 000 000 * 3/4 to account for base64 */
    CHUNK_SIZE: 950 000, /* Use a multiple of 4 */

    readFile: function(component, helper, file) {
        if (!file) return;
        var reader = new FileReader();
        self = this;
        reader.onload = function() {
            var dataURL = reader.result;
            component.set("v.pictureSrc", "https://s3-us-west-1.amazonaws.com/sfdc-demo/image-placeholder.png");
            self.upload(component, file, dataURL);
        };
        reader.readAsDataURL(file);
    },

    upload: function(component, file, dataURL) {
        console.log('uploading file ...');
         var fromPos = 0;
        var toPos = Math.min(dataURL.length, fromPos + this.CHUNK_SIZE);
        console.log('toPos  '+toPos);
        console.log(' fromPos '+fromPos);
        this.uploadChunk(component, file, dataURL, fromPos, toPos,'');

    },
        uploadChunk : function(component, file, dataURL, fromPos, toPos,contentDocumentId){
            console.log('uploading chunk ');
             var action = component.get("c.saveTheChunkChatterFile");
            var chunk = dataURL.substring(fromPos, toPos);
            console.log(chunk);
            action.setParams({
            parentId: component.get("v.recordId"),
            fileName: file.name,
            base64Data: encodeURIComponent(chunk), 
            contentType: file.type,
            contentDocumentId :contentDocumentId
            });
            var self = this;
             action.setCallback(this, function(a) {
            contentDocumentId = a.getReturnValue();
            console.log('return value '+contentDocumentId);
            fromPos = toPos;
            toPos = Math.min(dataURL.length, fromPos + self.CHUNK_SIZE);    
            if (fromPos < toPos) {
                self.uploadChunk(component, file, dataURL, fromPos, toPos, contentDocumentId);  
            }else{
                component.set("v.message", "File Uploaded");
            }
        });
               component.set("v.message", "Uploading...");

            $A.enqueueAction(action); 
       }
})

Apex Controller : 
 
@AuraEnabled
public static Id saveChatterFiles(Id parentId, String fileName, String base64Data, String contentType)  { 
    system.debug('Saving chatter files '+fileName + ' '+ contentType);
    ContentVersion testContentInsert =new ContentVersion(); 
     testContentInsert.Title =fileName; 
    testContentInsert.VersionData=EncodingUtil.base64Decode(base64Data);
    testContentInsert.PathOnClient='/' + fileName ;
     insert testContentInsert; 
    system.debug('testContentInsert.id '+ testContentInsert.id);
    testContentInsert = [select id, ContentDocumentId from ContentVersion WHERE Id =: testContentInsert.Id];
    ContentDocumentLink cl = new ContentDocumentLink();
    cl.ContentDocumentId = testContentInsert.ContentDocumentId;
    cl.LinkedEntityId = parentId; 
    cl.ShareType = 'V';
     cl.Visibility = 'AllUsers';
    insert cl;
    system.debug('testContentInsert.id');
    return testContentInsert.id;

}


@AuraEnabled                            
public static Id saveTheChunkChatterFile(id parentId,String fileName, String base64Data, String contentType, String contentDocumentId){
        system.debug('saving chatter file');
    if (contentDocumentId == '' || contentDocumentId==null ) {
        system.debug('null id');
        contentDocumentId = saveChatterFiles(parentId, fileName, base64Data, contentType);
    } else {
        system.debug('not null id');
        system.debug('id '+contentDocumentId);
        appendToFileChatter(contentDocumentId, base64Data);
    }

    return Id.valueOf(contentDocumentId);
}

@AuraEnabled
public static void appendToFileChatter(Id contentDocumentId, String base64Data) {
 base64Data = EncodingUtil.urlDecode(base64Data, 'UTF-8');
    system.debug('appending');
    ContentVersion a = [
        SELECT Id, VersionData,ContentDocumentId
        FROM ContentVersion
        WHERE Id = :contentDocumentId
    ];

    String existingBody = EncodingUtil.base64Encode(a.VersionData);
    a.VersionData = EncodingUtil.base64Decode(existingBody + base64Data); 

    update a;
}
Any kind of help or alternative to upload file in contentVersion using lightning component will be greatful.


 
Muzammil BajariaMuzammil Bajaria
Can anyone please suggese me some solution..
 
Sankeerth ReddySankeerth Reddy
hi @muzammil,

So, did you find the solution for the problem?..looks like am stuck in the same place
Manjeet Singh 17Manjeet Singh 17
In action.setParams(), directly pass the base64data:chunk. Don't use encodeURIComponent(chunk).
Hitesh Grover 7Hitesh Grover 7

Any solution? I am getting heap size error while upload file from Apex.

I tried from AJAX and native JS, i got error 405(method not allowed).

Bhargav P 11Bhargav P 11
Awesome.. It works perfectly.. Thank you Mangeet Singh.
Ajinkya Shelke 7Ajinkya Shelke 7
Hi Guys,
I am also trying to upload the large files using the CHUNKING but it was not working for the ContentVersion because by default IsMajorVersion field in the ContentVersion object is TRUE and its not updatable also. So While inserting the ContentVersion make IsMajorVersion  false so CHUNKING will work in the ContentVersion object.


ContentVersion testContentInsert =new ContentVersion(); 
        testContentInsert.Start_Date__c = Date.valueOf(startDate);
        testContentInsert.End_Date__c = Date.valueOf(endDate);
        testContentInsert.Title = fileName; 
        testContentInsert.IsMajorVersion = false;
        testContentInsert.VersionData = EncodingUtil.base64Decode(base64Data);
        testContentInsert.PathOnClient='/' + fileName ;
        
        try{
            insert testContentInsert;
        }
        catch(Exception Ex){
            System.debug('Ex==>'+Ex); 
        }
        
        
        testContentInsert = [select id, ContentDocumentId from ContentVersion WHERE Id =: testContentInsert.Id];
        
        ContentDocumentLink cl = new ContentDocumentLink();
        cl.ContentDocumentId = testContentInsert.ContentDocumentId;
        cl.LinkedEntityId = parentId; 
        cl.ShareType = 'V';
        cl.Visibility = 'AllUsers';
        
        try{
            insert cl;
        }
        catch(Exception Ex){
            System.debug('Ex==>'+Ex); 
        }
        
 
BatmansfdcBatmansfdc
Hi i am also facing with the same issue. Is this resolved??? The uploaded file is getting corrupted and if i upload a 4MB file after successfully uploading when i check the file size it is displaying just 900KB? Any solution is appreciated.Thanks
Suraj Patil 21Suraj Patil 21
Anybody found solution on this?
anyone know any better alternative approach?