aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.42k stars 2.12k forks source link

Multiple PageView events being fired in a single batch for the same page #8974

Closed rutwick-alic closed 2 years ago

rutwick-alic commented 3 years ago

Before opening, please confirm:

JavaScript Framework

Vue

Amplify APIs

Analytics

Amplify Categories

analytics

Environment information

``` # Put output below this line System: OS: Windows 10 10.0.18363 CPU: (8) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz Memory: 4.89 GB / 15.76 GB Binaries: Node: 14.13.1 - C:\Program Files\nodejs\node.EXE npm: 6.14.8 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: 94.0.4606.61 Edge: Spartan (44.18362.1593.0) Internet Explorer: 11.0.18362.1766 npmPackages: @material/mwc-list: ^0.18.0 => 0.18.0 (0.19.1) @material/mwc-select: ^0.18.0 => 0.18.0 @types/jest: ^24.0.19 => 24.9.1 @types/lodash.clonedeep: ^4.5.6 => 4.5.6 @types/uuid: ^8.3.0 => 8.3.1 @typescript-eslint/eslint-plugin: ^2.33.0 => 2.34.0 @typescript-eslint/parser: ^2.33.0 => 2.34.0 @vue/cli: ^4.5.6 => 4.5.13 @vue/cli-plugin-babel: ^4.5.0 => 4.5.13 @vue/cli-plugin-eslint: ^4.5.0 => 4.5.13 @vue/cli-plugin-pwa: ^4.5.0 => 4.5.13 @vue/cli-plugin-router: ^4.5.0 => 4.5.13 @vue/cli-plugin-typescript: ^4.5.0 => 4.5.13 @vue/cli-plugin-unit-jest: ^4.5.0 => 4.5.13 @vue/cli-plugin-vuex: ^4.5.0 => 4.5.13 @vue/cli-service: ^4.5.0 => 4.5.13 @vue/compiler-sfc: ^3.0.0 => 3.2.19 @vue/eslint-config-prettier: ^6.0.0 => 6.0.0 @vue/eslint-config-typescript: ^5.0.2 => 5.1.0 @vue/test-utils: ^2.0.0-0 => 2.0.0-rc.15 aws-amplify: ^3.3.18 => 3.4.3 core-js: ^3.6.5 => 3.18.1 (2.6.12) date-fns: ^2.19.0 => 2.24.0 eslint: ^6.7.2 => 6.8.0 eslint-plugin-prettier: ^3.1.3 => 3.4.1 eslint-plugin-vue: ^7.0.0-0 => 7.18.0 lodash.clonedeep: ^4.5.0 => 4.5.0 node-sass: ^4.12.0 => 4.14.1 prettier: ^1.19.1 => 1.19.1 register-service-worker: ^1.7.1 => 1.7.2 sass-loader: ^8.0.2 => 8.0.2 terser-webpack-plugin: ^4.2.3 => 4.2.3 (1.4.5) typescript: 4.3.5 => 4.3.5 (4.1.6) uuid: ^8.3.2 => 8.3.2 (3.4.0, 3.3.2) vue: ^3.2.2 => 3.2.19 (2.6.14) vue-class-component: ^8.0.0-beta.3 => 8.0.0-rc.1 vue-jest: ^5.0.0-0 => 5.0.0-alpha.10 (3.0.7) vue-loader: ^16.0.0-beta.8 => 16.8.1 (15.9.8) vue-property-decorator: ^9.0.0 => 9.1.2 vue-router: ^4.0.0-0 => 4.0.11 vuex: ^4.0.0-0 => 4.0.2 npmGlobalPackages: @vue/cli: 4.5.12 http-server: 0.12.3 ```

Describe the bug

PageView autotrack is being added multiple times to the batch. This is causing ambiguity in our analysis as a single page is being identified as being visited multiple times in the same user session at the same timestamp.

Does anyone know how to stop this? My configuration syntax is:

Analytics.autoTrack('pageView', {
    enable: true,
    disable: false,
    type: 'SPA',
    attributes: () => {
      return getAttrs() // returns the data to be sent
    },
    getUrl: () => getURL()
  })

In a batch with all the events on the same page, I can see pageView being recorded multiple times. Please check the attached screenshot. We send the route for the current page as well, which is how we identify that the event is being recorded multiple times.

Expected behavior

PageView unique for each page/route.

Reproduction steps

Visit the page, navigate to the next page in a website where this plugin is used.

Code Snippet

// Put your code below this line.

Log output

``` // Put your logs below this line ```

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

Chrome, Edge

Mobile Browser Version

No response

Additional information and screenshots

image

chrisbonifacio commented 2 years ago

Hi @rutwick-alic 👋 thanks for raising this issue. Did you follow the example in the documentation?

Analytics.autoTrack('pageView', {
    // REQUIRED, turn on/off the auto tracking
    enable: true,
    // OPTIONAL, the event name, by default is 'pageView'
    eventName: 'pageView',
    // OPTIONAL, the attributes of the event, you can either pass an object or a function 
    // which allows you to define dynamic attributes
    attributes: {
        attr: 'attr'
    },
    // when using function
    // attributes: () => {
    //    const attr = somewhere();
    //    return {
    //        myAttr: attr
    //    }
    // },
    // OPTIONAL, by default is 'multiPageApp'
    // you need to change it to 'SPA' if your app is a single-page app like React
    type: 'multiPageApp',
    // OPTIONAL, the service provider, by default is the Amazon Pinpoint
    provider: 'AWSPinpoint',
    // OPTIONAL, to get the current page url
    getUrl: () => {
        // the default function
        return window.location.origin + window.location.pathname;
    }
});

You might be able to get some insight into when/why the analytics event fires off as well by using either the Hub utility to listen to analytics events or by setting Amplify.Logger.LOG_LEVEL = "DEBUG".

rutwick-alic commented 2 years ago

Hi @chrisbonifacio Thank you for responding. Yes I have followed the config exactly as per the documentation. This is from my code:

  // Check for auto tracked name
  Analytics.autoTrack('pageView', {
    provider: 'AWSPinpoint',
    enable: true,
    disable: false,
    type: 'SPA',
    attributes: () => {
      return getAttrs() // returns the attributes
    },
    getUrl: () => getURL() // returns the URL
  })

Thanks.

chrisbonifacio commented 2 years ago

Hi @rutwick-alic When first visiting a page, do you see this events network request being made once? It seems like it fires once as long as I remain on the page but if I change tabs or from the browser and return to the page, the event will fire again.

Screen Shot 2021-10-15 at 1 53 44 PM
chrisbonifacio commented 2 years ago

Actually, I was not looking at the right data. I just realized you were sharing the request body from the events request. If you expand the attributes, you should see the url for the pages visited. From what I can tell, it seems to batch all of the page visits for the current session, which seems to stop/start whenever the visibility of the page changes.

{
  "BatchItem": {
    "a3034460-2ddf-11ec-9477-573f85e38e88": {
      "Endpoint": {},
      "Events": {
        "06c57502-2de4-11ec-b867-655c3a96ec30": {
          "Attributes": {},
          "EventType": "_session.start",
          "Session": {
            "Id": "06c57501-2de4-11ec-b867-655c3a96ec30",
            "StartTimestamp": "2021-10-15T18:16:33.104Z"
          },
          "Timestamp": "2021-10-15T18:16:33.104Z"
        },
        "08230930-2de4-11ec-b867-655c3a96ec30": {
          "Attributes": {
            "url": "http://localhost:8080/",
            "attr": "attr"
          },
          "EventType": "pageView",
          "Session": {
            "Id": "06c57501-2de4-11ec-b867-655c3a96ec30",
            "StartTimestamp": "2021-10-15T18:16:33.104Z"
          },
          "Timestamp": "2021-10-15T18:16:35.395Z"
        },
        "08230931-2de4-11ec-b867-655c3a96ec30": {
          "Attributes": {
            "url": "http://localhost:8080/about",
            "attr": "attr"
          },
          "EventType": "pageView",
          "Session": {
            "Id": "06c57501-2de4-11ec-b867-655c3a96ec30",
            "StartTimestamp": "2021-10-15T18:16:33.104Z"
          },
          "Timestamp": "2021-10-15T18:16:35.395Z"
        }
      }
    }
  }
}

Session stop event is triggered when page isn't visible

{
  "BatchItem": {
    "a3034460-2ddf-11ec-9477-573f85e38e88": {
      "Endpoint": {},
      "Events": {
        "dc712a00-2de4-11ec-aae9-170280f3291c": {
          "Attributes": {},
          "EventType": "_session.stop",
          "Session": {
            "Duration": 20491,
            "Id": "d03a7c50-2de4-11ec-aae9-170280f3291c",
            "StartTimestamp": "2021-10-15T18:22:11.093Z",
            "StopTimestamp": "2021-10-15T18:22:31.584Z"
          },
          "Timestamp": "2021-10-15T18:22:31.584Z"
        }
      }
    }
  }
}
chrisbonifacio commented 2 years ago

Closing this issue as it is expected behavior and not a bug.

rutwick-alic commented 2 years ago

Hi @chrisbonifacio

Yes I have followed the documentation, and we have turned off the 'session' events which are actually the page visibility events you have mentioned above. They are not triggered anymore, if you look at our config, we have them disabled. However even in a normal pageView, the event is batched multiple times.

github-actions[bot] commented 1 year ago

This issue has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.