cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Advocate II
Advocate II

PCF for attachments upload - Uploading large file throws error

Hi
 
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
 
Any suggestion on how to fix the size issue? Also any suggestion to build a scalable upload component in PowerApps?
 
Thanks
1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Advocate II
Advocate II

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.

View solution in original post

3 REPLIES 3
Highlighted
Community Support
Community Support

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,

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.
Highlighted
Advocate II
Advocate II

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.

View solution in original post

Highlighted
Community Support
Community Support

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,

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Find your favorite faces from the community presenting at the Power Platform Community Conference!

Watch Now

Experience what’s next for Power Apps

See the latest Power Apps innovations, updates, and demos from the Microsoft Business Applications Launch Event.

Power Platform ISV Studio

Power Platform ISV Studio

ISV Studio is designed to become the go-to Power Platform destination for ISV’s to monitor & manage published applications.

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Users online (5,413)