1

I have application which should take using android/iPhone and send to SF backend. But when try to send image I fetch error:

Received exception event aura:systemError from server

and:

enter image description here

And my code:

<aura:component controller="PhotoController" access="global">

<aura:attribute name="valuePhoto" type="String" default=""/>
<aura:attribute name="sizePhoto" type="Integer" default="0"/>
<aura:attribute name="debuger" type="String" default="start"/>
<aura:attribute name="isPhotoLoaded" type="Boolean" default="false"/>
<aura:attribute name="photoSource" type="String" />

<h1>Photo component</h1>
<h2>{!v.valuePhoto.length}</h2>
<input value="{!v.valuePhoto}" aura:id="photo" name="photo" label="Photo" type="file" accept="image/*;capture=camera" onchange="{!c.takePhoto}"/>

<h1>Size of filte retirned from server : {!v.sizePhoto}</h1><br/>
{!v.debuger}

<aura:if isTrue="{!v.isPhotoLoaded}">
    <img src="{!v.photoSource}"/>
</aura:if>

({
takePhoto : function(component, event, helper) {
    var photo_as_string = component.get('v.valuePhoto');
    var file = component.find("photo").getElement().files[0];
    var fr = new FileReader();
    fr.onload = function() {
        var fileContents = fr.result;
        var base64Mark = 'base64,';
        var dataStart = fileContents.indexOf(base64Mark) + base64Mark.length;
        fileContents = fileContents.substring(dataStart);

        component.set('v.photoSource', fileContents);
        var savePhotoAction = component.get('c.savePhoto');

        savePhotoAction.setParams({
            photo_value: fileContents
        });

        savePhotoAction.setCallback(this, function(response) {
            var state = response.getState();
            if(state === 'SUCCESS') {
                var size = response.getReturnValue();
                component.set('v.sizePhoto', size);
            } else if(state === 'ERROR') {
                var errors = response.getError();
                if(errors && errors.length && errors[0] && errors[0].message) {
                    console.error(errors[0].message);
                }
            } else {
                console.error('Unexpected error was occured')
            }
        });
        setTimeout(() => $A.enqueueAction(savePhotoAction), 1000);
        setTimeout(() => component.set('v.debuger', component.get('v.photoSource').length), 2000);
    };
    //
    fr.readAsDataURL(file);

    fr.onloadend = function() {console.log('ended')}
}

})

public with sharing class PhotoController {

@AuraEnabled
public static Integer savePhoto(String photo_value) {
    System.debug('photo_value is null -> ' + (photo_value == null));
    try {
        Blob decoded = EncodingUtil.base64Decode(photo_value);
        Integer size = decoded.size();
        System.debug('Size -> ' + size);
        return size;
    } catch(Exception e) {
        String message = e.getMessage();
        Exception cause = e.getCause();

        System.debug('message -> ' + message);
        System.debug('cause -> ' + cause);

        throw new AuraHandledException(e.getMessage());
    }
}

}

How workaround this? Maybe there is way to reduce size of photo? And what max size of image can I send to salesforce, I noticed that is near 0.75Mb?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.