Answered

PCF for attachments upload - Uploading large file throws error

(0) Share

Report

Posted on by Rajesh

104

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.

PowerApps does not have a native file attachment control. We tried using the SharePoint file attachment control as shown in this link (https://officepoweruser.com/upload-a-file-to-sharepoint-in-power-apps/ ), however this has severe limitations. It doesn't allow multiple file select, max. file size is only 10MB.

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

It is not clear from Device API documentation if it's a known limitation - https://docs.microsoft.com/en-us/powerapps/developer/component-framework/reference/device/pickfile

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

https://docs.microsoft.com/en-us/powerapps/developer/component-framework/manifest-schema-reference/type

Any suggestion on how to fix the size issue? Also any suggestion to build a scalable upload component in PowerApps?

Thanks

All responses (6)

Answers (1)

VIP0289 18 on at

Like (0)

Report

Re: PCF for attachments upload - Uploading large file throws error

if we could get the pcf that would be great, i'm currently running into file size limits uploading to azure blob and i think i've exhausted all options
msuser 54 on at

Like (0)

Report

Re: PCF for attachments upload - Uploading large file throws error

Hi, @Rajesh i have a similar requirement please let me know if it is possible to share the final code or if possible please share the PCF component zip file through Github,
thank you.
MarinaPA 70 on at

Like (0)

Report

Re: PCF for attachments upload - Uploading large file throws error

Hi,
is there any solution for large file upload? I also need to upload large files with powerapps control in sharepoint list or library, the limit is still10MB, can this be increased?
Thank you
v-xida-msft on at

Like (0)

Report

Re: PCF for attachments upload - Uploading large file throws error

Hi @Rajesh ,

Have you solved your problem?

If you have solved your problem, please consider go ahead to click "Accept as Solution" to identify this thread has been solved

If you do not mind, you could consider share your solution here, so any other users faced same issue could refer to your solution.

Best regards,
Verified answer

Rajesh 104 on at

Like (0)

Report

Re: PCF for attachments upload - Uploading large file throws error

@v-xida-msft I've managed to solve this by calling the Azure javascript library for file upload from within the component. With this approach I'm able to upload very large files and multiple file uploads. I've tried uploading 500 MB file and seemed to work fine. Component now sends only the list of files uploaded back to the host, so I never run into the issue of string limitation.
v-xida-msft on at

Like (1)

Report

Re: PCF for attachments upload - Uploading large file throws error

Hi @Rajesh ,

Based on the Client API that you mentioned, I think you are in right direction. The context.device.pickFile(options) Client API could opens a dialog box to select files from your computer (web client) or mobile device (mobile client), but this API is only available in Model-Driven app rather than canvas app.

According to the issue that you mentioned, I think this issue is related to the data type of the "value" property you set in your PCF project. When you assign value to the "value" (Multiple type) property, it could not be more than the known limit -- 1,048,576 text characters.

Based on the needs that you mentioned, I afraid that the "Multiple" data type could not achieve your needs, and there is no way to achieve your needs using PCF due to this known limit.

If you would like this feature to be improved in PowerApps, please consider submit an idea to PowerApps Ideas Forum:

https://powerusers.microsoft.com/t5/Power-Apps-Ideas/idb-p/PowerAppsIdeas

If you would like to get further help in this issue, please consider submit an assisted support ticket through the following link:

https://powerapps.microsoft.com/en-us/support/pro

Best regards,