Example of using HubSpot API to publish forms without using non-hubspot forms

hubspot-api-example.js

// See https://legacydocs.hubspot.com/docs/methods/forms/submit_form

// See https://legacydocs.hubspot.com/docs/methods/get-account-details?hsLang=en
const PORTAL_ID = 123456;
// See https://knowledge.hubspot.com/forms/find-your-form-guid?_ga=2.268783985.1076297500.1664283830-1987132661.1663058677
const FORM_ID = "this-is-a-guid";
// This is the marketing subscription for GDPR stuff
// You can find this by calling https://api.hubapi.com/email/public/v1/subscriptions?hapikey=your-api-key
// And cross referencing against the subscriptions listed in HubSpot > settings > marketing > email > subscription types
const MARKETING_SUBSCRIPTION_ID = "123456"

function submitToHubspot(email) {
  return fetch(
    `https://api.hsforms.com/submissions/v3/integration/submit/${PORTAL_ID}/${FORM_ID}`,
    {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        fields: [
          {
            name: "email",
            value: email,
          },
        ],
      }),
      legalConsentOptions: {
        // This is required if GDPR is enabled in HubSpot
        consent: {
          consentToProcess: true,
          // this is about us processing their data. it is required and they
          // must accept these terms
          text: "I have read and accept the Terms & Conditions and Data Privacy",
          communications: [ {
           value: true,
            "subscriptionTypeId": MARKETING_SUBSCRIPTION_ID,
            "text": "I want to receive Jacob's latest news. You can unsubscribe from these communications at any time, check our Data Privacy."
          },
        },
      },
    }
  ).then(res => res.json())
}

document.querySelector("#myform").addEventListener("submit", (e) => {
  e.preventDefault();
  // Get the form value that has "email" as name attribute
  const email = new FormData(e.target).get("email")
  submitToHubspot(email)
})