APIs & Integrations

ekingstad
Member

Forms API help - needing server side script example

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:

0 Upvotes
11 Replies 11
ekingstad
Member

Forms API help - needing server side script example

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>

0 Upvotes
3PETE
HubSpot Employee
HubSpot Employee

Forms API help - needing server side script example

@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.

0 Upvotes
Not applicable

Forms API help - needing server side script example

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?

0 Upvotes
3PETE
HubSpot Employee
HubSpot Employee

Forms API help - needing server side script example

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

0 Upvotes
3PETE
HubSpot Employee
HubSpot Employee

Forms API help - needing server side script example

@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.

0 Upvotes
ekingstad
Member

Forms API help - needing server side script example

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?

0 Upvotes
3PETE
HubSpot Employee
HubSpot Employee

Forms API help - needing server side script example

@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.

0 Upvotes
ekingstad
Member

Forms API help - needing server side script example

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”?

0 Upvotes
3PETE
HubSpot Employee
HubSpot Employee

Forms API help - needing server side script example

@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

0 Upvotes
ekingstad
Member

Forms API help - needing server side script example

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

0 Upvotes
3PETE
HubSpot Employee
HubSpot Employee

Forms API help - needing server side script example

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

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

0 Upvotes