APIs & Integrations

DavidFJones
Membro | Parceiro Platinum
Membro | Parceiro Platinum

Capturing HTML Form File Upload/Submission

Hey all,

I'm trying to use a form to allow users to upload a profile photo to their account. This will be used in a custom cms theme I am developing. I'm a little unclear on how to actually capture this input however. 

Currently I have a custom HTML form on one of my theme pages, and this form is being CAPTURED by HubSpot. I have also stored the name of the file that the user has uploaded in a custom contact property. However, when I attempt to do anything with this property it looks like only the name of the file is being stored/captured by HubSpot.

Ultimately what I am attempting to do is to use a contact property that will store a profile photo, that can then be pulled and displayed on the end users screen. 

0 Avaliação positiva
5 Respostas 5
wilbertmuza
Participante | Parceiro Diamante
Participante | Parceiro Diamante

Capturing HTML Form File Upload/Submission

Hi @DavidFJones 

 

If you know how to write code or deploy a simple Cloud function/AWS Lambda etc. Here is the code that I have written that takes the uploaded file url which is not public and upload it to your file manager then get a public url to that file 

https://snippets.wilbertzgroup.com/snippet/bj7dwu536-88zLYUpDeib

0 Avaliação positiva
DavidFJones
Membro | Parceiro Platinum
Membro | Parceiro Platinum

Capturing HTML Form File Upload/Submission

So an update. I feel like there is some step I am missing. I have set up a form where the user can upload a file. I then hit this endpoint - https://legacydocs.hubspot.com/docs/methods/forms/get-submissions-for-a-form
but from here I can't seem to find the file id for the file that was uploaded. The only thing I can see is the name of the file, stored as a string. 

I'm trying to use the Get a file uploaded via form field endpoint - https://legacydocs.hubspot.com/docs/methods/form-integrations/v1/uploaded-files/signed-url-redirect
and this page links to the previously linked page, stating this is where I can find the form metadata and in turn, find the file id. 

0 Avaliação positiva
WendyGoh
HubSpot Employee
HubSpot Employee

Capturing HTML Form File Upload/Submission

Hey @DavidFJones,

 

Just to clarify, are you using a property field type - file to upload the file on the form? If so, could you share with me the following:

1. Portal ID in question

2. Form ID/Name in question

0 Avaliação positiva
DavidFJones
Membro | Parceiro Platinum
Membro | Parceiro Platinum

Capturing HTML Form File Upload/Submission

Hey @WendyGoh . I doubled checked and I am using the file type file. For the other info...

Portal ID - 6670407
Form GUID - 3a06aa50-1476-4548-b09c-01895d75204d
Form name (in HubSpot) -  .profile-form

0 Avaliação positiva
WendyGoh
HubSpot Employee
HubSpot Employee

Capturing HTML Form File Upload/Submission

Hey @DavidFJones,

 

Thanks for sharing these details and I believe I'll be able to shed some lights here!

 

Taking a look at form .profile-form, I noted that it is a non-HubSpot form and according to this article:

 

Please note: all data submitted to non-HubSpot form fields will only match to single-line text field type properties in HubSpot. Non-HubSpot form fields cannot match with other field types.

Since non-HubSpot forms can only map to single line text properties we cannot map to any file upload properties and pull in files uploaded to this external form.

 

In your case, there's two workaround that I can think of:

1. Use HubSpot file upload properties on a HubSpot forms which would map to these properties and store these files in the file manager.

 

2. As mentioned on this forum thread, your team can explore the option of building out a custom solution by using HubSpot Forms API.

0 Avaliação positiva