Implement Adobe Analytics via Adobe Launch on SPA/PWA | BCS

Implement Adobe Analytics via Adobe Launch on SPA/PWA

Adobe Launch Haran Huang 2 years ago (2019-12-06) 835 Views 0 Comments

In this section we will talk about how to track SPA(Single-Page Applications ) and  PWA(Progressive Web Apps)in Adobe Launch.

Principle

In general, SPAs do not rely on traditional browser page loads,   the URL of the page the user sees may has not changed, but the content of the page displayed by the user does change, so the traditional tracking based on Page Load is not applicable.

All SPAs code structures are different. I will explain the general method here to teach you how to deal with these problems. Simple diagram of working with SPAs in Launch by Adobe:
Implement Adobe Analytics via Adobe Launch on SPA/PWA
  • Step1:View change or action on SPA page——Listen to some changes on the page. When the user operates on the SPAs page, although the URL is not changed, the content displayed on the page will change, so you can listen to these changes until the user clicks on a different page. The setting for this step is the EVENTS in Rules.
  • Step2、Step2、Step4——This step needs to be processed on the page and needs to be developed. When the user operates, every page that is opened will have some data to be passed to Adobe Launch, such as Page Name, Page Title, Page URL … The page needs to be assembled and placed now, either through the Data Layer or other Event Type such as Data Element Change, History, Custom Event, etc.
  • Step5:Set Variable——This step is in ACTIONS, configure some page information passed in the previous step, configure it into the form of a page, and then send it out in the form of Beacon to become a PageView.
  • Step6、Step7:Because it is doing SPA tracking, it is hoped to treat it as a page, so it is often set to st.():
  • Step8:Clear Vars——This setting is different from the normal page setting. It should be loaded only once for a single page application. If it is not set, the PageView sent later will inherit the data from the previous first load, which will cause confusion, so it needs to be Clear, directly use the data sent from the previous page instead of the previous one.

Configuration Process: Setting the Rule

Create a Rule named “Adobe Analytics Base Tracking Code(SPA)”

Event

Create two in the Event, one is Library Loaded (Page Top), and the other is History Change, which does not require any settings:

Implement Adobe Analytics via Adobe Launch on SPA/PWA

Library Loaded (Page Top) is used to track normal page loading, and History Change is used to track non-page loading, that is, SPA.

Action

Do the following settings in Action:

Implement Adobe Analytics via Adobe Launch on SPA/PWA

The focus is on “Set Variables”, the ADDITIONAL SETTINGS in “Set Variables” should set the Page Name and Page URL. This setting is to update the Page Name and Page URL to the latest.

If it is not set, the sent page url will be the first page, used to access other pages, the page url will remain unchanged, and the parameter g will remain unchanged.

Publish and Test

Finally you can go to test and you can publish it without any problems.

If you don't understand, You can leave a comment below or email me ([email protected]).
Like (1)
Post my comment
Cancel comment
Expression Texture Bold Strikethrough Center Italic Sign in

Hi, you need to fill in your nickname and email!

  • Nickname (required)
  • Email (required)
  • Website