Forms API help - needing server side script example


#1

Wanting clarification on how this works. Can someone please share an example of the server side script used that shows proper language in JSON for calling the hubspotutk and other info included in the hubspot context parameter?

Sending only first name (“property”: “firstname”,“value”:/registrant-first_name/), last name (“property”: “lastname”,“value”:/registrant-last_name/) and email address (“property”: “email”,“value”: /registrant-email/) from the external form fields that will either create or update a contact. I have the parallel form setup in Hubspot and have the PortalId and FormId. Just need help understanding the basic format of the script to plant on the website where the external form resides so that this info will be sent along with the HS Context info when the form is submitted.

Any and all help appreciated for this newbie!! :slight_smile:


#2

@ekingstad Here is a link to our docs. On the right hand side there are tabs that show example code in a couple different languages.


#3

I’ve been reviewing those docs for days. I’m using a NodeJS code but I understand that code is planted on a server (I’m using Built.io). But I’m needing help in understanding what code/script is embedded in the external form itself to send the data to the NodeJS. Any thoughts?


#4

@ekingstad You can use the onFormSubmit function in our code. In there I would add a handler that can pass along your info to the server.


#5

I’ve scrapped the idea of using the NodeJS and have embedded code in the external form itself. But here’s what I’m not clear about (from HS instruction):

“In addition to sending the url encoded form data collected from your HTML form fields, the server side script needs to request the user’s hubspotutk cookie and other visitor data used to populate the hs_context parameter. With this additional data, HubSpot will be able to record the visitors analytic information.”`

The script that I’ve embedded in the external form:

<script type="text/javascript">

// jQuery CORS example

var person = {
firstname: ‘/registrant-first_name/’,
lastname: ‘/registrant-last_name/’,
email: ‘/registrant-email/

    };

var urL=‘https://forms.hubspot.com/uploads/form/v2/4XXXXX/8XXXXcb5-5de0-XXXX-82a3-XXXfeba4b3f8’;

$.ajax({
xhrFields: {
withCredentials: true
},
type: “POST”,
data: person ,
url: urL
}).done(function (data) {
console.log(data);
});

What code do I use to grab the “Hutk” and “HS Context”?


#6

@ekingstad The utk you can grab from the cookie. The HS Context you have to create. Also our servers won’t allow CORS requests so it will have to be done server side. Here is our docs on examples


#7

How do I access the cookie? I’m just not connecting the dots here…


#8

The cookie is in the browser. You can use Javascript or JQuery to access it.

https://www.w3schools.com/js/js_cookies.asp


#9

Here’s the code that’s now in place. It’s pulling the tracking code, and all the other info for creating a new record, but I’m not convinced it’s setup properly - don’t see how it’s affecting conversion info and web analytics info in Hubspot Any thoughts or feedback? What should I be expecting to happen in HS?

<script type="text/javascript">

// jQuery CORS example

function getCookie(cname) {
var name = cname + “=”;
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(’;’);
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ’ ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return “”;
}

var currentCookie =getCookie(‘hubspotutk’);
var person = {
“firstname”: “/registrant-first_name/”,
“lastname”: “/registrant-last_name/”,
“email”: “/registrant-email/”,

        "hs_context":{
               "hutk": currentCookie,
              "pageName":"Page name",
              "pageUrl":"https://pageurl.com"
                   }
      
    };

console.log(person);
var urL=‘https://forms.hubspot.com/uploads/form/v2/xxxxxx/xxxxxxx5-5de0-xxx6-xxxx-xxxfebaxxx’;

$.ajax({
xhrFields: {
withCredentials: true
},
type: “POST”,
data: person ,
url: urL
}).done(function (data) {
console.log(data);
});

</script>


#10

@ekingstad You need to make your API call to HubSpot, server side. You cannot use ajax or any other client side library to make the request.


#12

is this still the case? i'm new to hubspot's dev. platform and i'm trying to figure out whether i can make a call to the Forms API client-side or server-side only?


#13

@devenh This is still the case. Your calls to HubSpot must be made server-side.