Add more information to PrimeNG FileUpload data transfer

Question

I want to send additional information with files that are downloaded using the primeng fileupload component. Basically, I need to know what these downloaded files are about.

I can add headers to the onBeforeSend function, for example, an authorization code, as in the example below. Where can I add additional information, for example. 'DocumentID': 'A123'

onBeforeSend(event) { event.xhr.setRequestHeader("Authorization", 'Bearer ' + this.authService.getAccessToken()); } 

Somebody knows?

thanks

Answer 1

There is an object called event.formData in the onBeforeSend event of the primeng fileupload event.formData , you can use this object to configure the request with additional information. I was able to successfully implement this functionality in the current project I'm working on.

In component.ts file:

  onBeforeSend(event) { event.xhr.setRequestHeader("Authorization", `Bearer ${this.authService.getToken()}`); event.formData.append('DocumentID', 'A123'); } 

In the template.html file:

  <p-fileUpload name="test[]" [url]="url_test" (onBeforeSend)="onBeforeSend($event)" accept="image/*" maxFileSize="5000000" withCredentials="true"> 

Hope this helps!