How can I upload a file using API

Developer Support APIs & Integrations
1

Hi! I’m not understanding how to upload a file (.png, .jpg or .pdf) to hubpost. How can I use this code without the axios?

import axios from "axios";

import { join } from "path";

import { createReadStream } from "fs";

import FormData from "form-data";

​

const HubspotAPI = axios.create({

baseURL: "https://api.hubapi.com",

headers: {

` Authorization: ```

}

});

​

try {

// Create and upload a new file

const formData = new FormData();

​

formData.append("file", createReadStream(join(__dirname, "cat.webp")));

formData.append("folderPath", "cats");

formData.append("options", JSON.stringify({

access: "PUBLIC_NOT_INDEXABLE",

overwrite: true

}))

const { data: { id: fileId } } = await HubspotAPI.post("/files/v3/files", formData)

​

// Send the file to a object

const { data: noteResponse } = await HubspotAPI.post("/engagements/v1/engagements", {

"engagement": {

"type": "NOTE",

},

"metadata": {

"body": "Arquivo enviado pelo CMS."

},

"associations": {

"contactIds": [5686102],

},

"attachments": [

{

"id": fileId

}

],

})

​

console.log(noteResponse)

} catch (error) {

console.log(error.response.data)

}

2

Hey @mihochheim,

Are you wanting with or without axios? In my opinion, it’ll be easier with axios. Otherwise you’ll be using an XMLHttpRequest (XHR) in vanilla JavaScript which is ugly.

You’ll need to remember to set the header variable “Content-Type” so the receiving server knows how to process your payload. Also, I am not sure what you are importing with that import FormData from “form-data”; line.

Here’s an example using axios:

const formData = new FormData();
formData.append('file', createReadStream(join(__dirname, "cat.webp")));

axios.post('/server/upload', formData, {
 headers: {
 'Content-Type': 'multipart/form-data'
 }
})
 .then(response => {
 console.log(response.data);
 });

And here’s an example using XHR:

const xhr = new XMLHttpRequest();
xhr.open('POST', '/server/upload', true);

const formData = new FormData();
formData.append('file', createReadStream(join(__dirname, "cat.webp")));

xhr.onload = function() {
 if (xhr.status === 200) {
 console.log(xhr.responseText);
 }
};

xhr.send(formData);

Hope that helps!