I'm working on a canvas PowerApps dashboard to allow users to upload files to a Azure file storage. Users should have the ability to select multiple files. The no. of files to be uploaded is quite large, could be in hundreds. The file size is also quite high, could be upto 250MB.
I've tried creating a custom PCF component which uses native Device API as shown below.
private onUploadButtonClick(event: Event): void
{
var fileOptions = {} as ComponentFramework.DeviceApi.PickFileOptions;
fileOptions.allowMultipleFiles = true;
fileOptions.maximumAllowedFileSize = 104857600;
this._context.device.pickFile(fileOptions).then(this.processFile.bind(this), this.showError.bind(this));
}
private processFile(files: ComponentFramework.FileObject[]): void
{
if(files.length > 0)
{
let fileList = "";
try{
files.forEach(element => {
fileList += element.fileName;
fileList += "#";
fileList += element.fileContent;
fileList += ";";
});
this._value = fileList;
this._notifyOutputChanged();
}
catch(err)
{
this.showError();
}
}
}
public getOutputs(): IOutputs
{
// return outputs
let result: IOutputs =
{
value: this._value!
};
return result;
}
<property name="value" display-name-key="value_Display_Key" description-key="value_Desc_Key" of-type="Multiple" usage="bound" required="true" />
In the processFile callback, I'm looping through the list of files selected, concatenating the base64 file content and returning that as output. Though I've set the max. allowed size is 100MB, I get an error when I try to upload a 80MB file. The max. size I could upload was about 70MB
However the return data type that I'm using is "multiple" seems to suggest the value can only contain up to 1,048,576 text characters. Not sure if the issue is caused by this
Any suggestion on how to fix the size issue? Also any suggestion to build a scalable upload component in PowerApps?