File upload using hubspot submit form api

Develop, Build & Integrate APIs & Integrations
1

Hellow There,

I have been trying to upload file in my custom html form and submit it to my hubspot form using submit form api.

“POST https://api.hsforms.com/submissions/v3/integration/submit/:portalId/:formGuid”

I am creating an array of fields and an object for each field as per below. And then pushing the field object to the array.

let answers = [];

let nameObj = {};
nameObj.name = “firstname”;
nameObj.value = ‘Test112’;
answers.push(nameObj);

However, I am not sure what object I should be creating for file upload in both cases when it is single file or multiple files.

Can someone please guide me in the right direction.

2

Did you find a good solution for this? ie. do you have to manually upload first via this https://legacydocs.hubspot.com/docs/methods/files/v3/upload_new_file, then append the url to that field to the v3 forms api?

3

@KNakamura2

No. Unfortunately I didnt find any solution for this yet as my problem statement is uploading a file in custom HTML form directly from the user’s machine and pushing it to Hubspot. And as while client side upload, there is no backend to support the file_option parameters. Hence it didnt work.

I used Email-JS service as a workaround for this to send the uploaded files in the email.

Are you also looking for solution for similar issue or do you have some solution for this?

4

okay got it to work, by:

  1. adding an onchange handler on the file input field, that triggers a JS function to post the file contents of that field to the server
  2. on the server we upload the file using file upload api (i think you can save this anywhere though like s3 bucket - you just need a url to actually send back to hubspot form api) - https://legacydocs.hubspot.com/docs/methods/files/v3/upload_new_file
  3. the response returns file meta data https://legacydocs.hubspot.com/docs/methods/files/get_files_file_id so we send back the url field to the JS function call in step 1
  4. then we store the url value into a hidden field in the form
  5. when the form is actually submitted we just send the url field (had to set it to public, but not indexible) via https://legacydocs.hubspot.com/docs/methods/forms/submit_form_v3_authentication , so that the link in hubspot from the form submission works

our form is multi-step, so there’s no race condition to wait for the file upload to complete before actual form is submitted, thats why we’re able to trigger the upload just on file input fields change event.