Sending single page app page-views to HubSpot


#1

Hi there,

We’re integrating HubSpot with our Angular-driven, single page app, using Segment. We’ve created custom code to pass specific paths and urls to Segment, so that we could get Page Views to work with our various integrations.

This has worked flawlessly with our other integrations, but HubSpot is still ignoring a large chunk of the URL passed to it.

A sample page view call is as follows:

analytics.page({
  path: '/campaigns',
  url: 'http://dev:3000/#/campaigns',
  name: 'campaign_list',
  referrer: '',
  search: '',
  title: 'Vantage'
});

Our other integrations receive a page view at /campaigns, but HubSpot appears to just see the root url, http://dev:3000. This seems odd, since we’ve explicitly passed path: '/campaigns'.

Given the growing number of single page apps, this is something I expected HubSpot to support, so perhaps it’s still user error. Any feedback would be appreciated, as this greatly impacts our use of HubSpot.

Thank you,
Ivan.


Single Page Application HS_CONTEXT Forms Identify TrackPage
#2

I’ve had a similar problem where I previously worked. It would be nice if someone has a suggestion or, better yet, a solution


#3

Ditto on this. I have a similar issue. Would love to hear an update.


#4

Hi everyone,

Our tracking code doesn’t currently support single page apps. It’s something that we will be adding in the future but there’s no timeline on that just yet.


#5

Hey Dadams,

Which tracking code is this? I’m talking about PageView events that we manually send, ourselves.


#6

@IvanD I don’t know all of the details for how Segment implements our tracking system, but Segment would need to load our tracking code on each page in order to track views in HubSpot. Our tracking code automatically tracks the page view on load, and while it is possible to manually track a page view after loading, we don’t support manually setting the details for the view, since the code grabs the details for the page automatically, and we don’t currently support logging of hash fragments.


#7

I understand that the party line on this is “We are working in it, we don’t have a timeline”, but is there anything more you can give here?

The ability to track page views on SPA’s is a basic function. SPA’s are not exactly state of the art anymore (damn, they’ve been around for 7 years) so I’m a bit confused that you are charging 14,000 USD per year for something which can’t even track basic elements of traffic (I assumed that would be a given when I accepted to pay for a Pro package).

Is there any timeline here? Any ways we can work around it? This is extremely frustrating and forces us to keep juggling between different software so we can get the data we need.


#8

Any further evolution on this? Thanks a lot.


#9

It appears like this is possible: http://developers.hubspot.com/docs/methods/tracking_code_api/track_page_view


#10

@IvanD This is the correct way of doing it. You will need to inject this wherever your URL change event is captured.


#11

Hi there,

We have a similar issue, we hope you can help with.

-We use AngularJS which is Single Page Application (SPA)

  • In a normal webpage system the HUBSPOT javascript plugin, reloads when each page loads
    -Now in our SPA application the page never really reloads/refreshes the view.
    -So we use the standard AngularJS handler which basically fires on each page load it’s called stateChangeSuccess

    $rootScope.$on(’$stateChangeSuccess’, function

             _hsq.push(["identify", {
                 email: currentSession.Email
             }]);
    
         // Track a new page using setPath:
         //var _hsq = window._hsq = window._hsq || [];
         _hsq.push(['setPath', '#!'+$location.path()]);
         
         // Track the page view for the new page
         _hsq.push(['trackPageView']);
    

-This works however there are a few problems:

  1. If the user lands on a page with a Form on it that we have marked up with the appropriate Hubspot CSS selectors and submits the form. The data is sent to HubSpot as we expect it to be. However, if the user navigates to another page the HubSpot code is not smart enough to rescan the HTML DOM and check if there is a Form it can submit is available. How do we force the Hubspot code to “reinitialise” essentially we want it to rescan the DOM as it would do on a normal HTML page reload. We assume it has something to do with the HS_CONTEXT but have no understanding on the method we can call to reinit. Could you give us some pointers?

Is there hbspt.forms.refresh() Or something equivalent?

  1. If the user logs out how do we tell HubSpot that this is an anonymous user i.e. how should we call the “identify” method to tell HubSpot we have logged out?

Many thanks!


#12

Any updates on this matter? @dadams