অ্যাঙ্গুলারজেএস সহ গুগল অ্যানালিটিক্স পৃষ্ঠা দর্শনগুলি ট্র্যাক করা


221

আমি অ্যাঙ্গুলারজেএসকে ফ্রন্টএন্ড হিসাবে ব্যবহার করে একটি নতুন অ্যাপ সেট আপ করছি। ক্লায়েন্টের পাশের সমস্ত কিছু HTML5 পুসস্টেট দিয়ে সম্পন্ন হয়েছে এবং আমি গুগল অ্যানালিটিকসে আমার পৃষ্ঠা দর্শনগুলি ট্র্যাক করতে সক্ষম হতে চাই।


কৌণিকবিজ্ঞানগুলি ব্যবহার
ডেভিড

2
কৌণিকবিজ্ঞানগুলি হ্রাস করা হয়। কৌণিক-গুগল-বিশ্লেষণগুলি
ওয়েবদেব

5
@ ওয়েবদেব 5 অ্যাঙ্গুলারিক্সগুলির একটি নতুন সংস্করণ বাইরে। এটি চেষ্টা করে দেখুন: অ্যাঙ্গুলারটিক্স.github.io
ডেভনার

উত্তর:


240

আপনি যদি ng-viewনিজের অ্যাংুলার অ্যাপ্লিকেশন ব্যবহার করে থাকেন তবে আপনি $viewContentLoadedইভেন্টটি শুনতে এবং একটি ট্র্যাকিং ইভেন্ট গুগল অ্যানালিটিকসে ঠেলাতে পারেন।

ধরে var _gaqনিই যে আপনি আপনার ট্র্যাকিং কোডটি আপনার মূল ইনডেক্স.ইচটিএমএল ফাইলে এবং মাইসিটিআরএল নামের সাথে সেট করেছেন যা আপনি ng-controllerনির্দেশকে সংজ্ঞায়িত করেছেন ।

function MyCtrl($scope, $location, $window) {
  $scope.$on('$viewContentLoaded', function(event) {
    $window._gaq.push(['_trackPageView', $location.url()]);
  });
}

আপডেট: গুগল-অ্যানালিটিক্সের নতুন সংস্করণটির জন্য এটি ব্যবহার করুন

function MyCtrl($scope, $location, $window) {
  $scope.$on('$viewContentLoaded', function(event) {
    $window.ga('send', 'pageview', { page: $location.url() });
  });
}

12
এফডব্লিউআইডাব্লিউড এটি হওয়া উচিত _trackPageviewএবং নয় _trackPageView... 10 মিনিটের মাথার স্ক্র্যাচিংয়ে ব্যয় করেছেন :)
সজল

123
আমি ব্যবহার করব $rootScope.$on('$routeChangeSuccess', ...)
বন্ধু

5
@ ডেভিড্রাইভার্স এইচএম, এটি বেশ কিছুক্ষণ হয়েছে, তবে এই উত্তরটি এবং আমার মন্তব্যে এক নজরে তাকানো থেকে মনে হচ্ছে এটির প্রয়োগটি $rootScopeনিশ্চিত করে যে এটি অন্য কোনও ইভেন্ট বা ডিওএম পরিবর্তন দ্বারা মুছে ফেলা হবে না এবং এটি ব্যবহারের routeChangeSuccessফলে প্রতিবারই গুলি চালানো হবে আপনার বারের উত্স টেম্পলেটটি পরিবর্তন করার পরিবর্তে লোকেশন বার পরিবর্তন হয়। যে জানার জন্য?
ভাল্লুক

5
@ dg988 S রুট চেঞ্জসুকসেস ইভেন্টের সময় আপনি পৃষ্ঠার শিরোনামটি জানেন না which এই পৃষ্ঠার ইউআরএল দিয়ে একা গুগল অ্যানালিটিকস পূর্ববর্তী পৃষ্ঠার একটি শিরোনাম ট্র্যাক করবে।
কনস্ট্যান্টিন টার্কাস

43
আপনি যদি জিএ নতুন স্ক্রিপ্ট ব্যবহার করছেন তবে এটি অংশটির $window.ga('send', 'pageview', { page: $location.path() });পরিবর্তে $window._gaq...। এছাড়াও, আপনি ga('send', 'pageview');যখন কোনও পৃষ্ঠায় প্রথম অবতরণ করবেন তখন ডুপ্লিকেটগুলি রোধ করতে আপনি আপনার আসল জিএ কোড থেকে সরিয়ে নিতে পারেন ।
সিডব্লিউস্পিয়ার

57

যখন কোনও নতুন ভিউ লোড হয় AngularJS, গুগল অ্যানালিটিক্স এটিকে কোনও নতুন পৃষ্ঠা লোড হিসাবে গণনা করে না। ভাগ্যক্রমে GA কে ম্যানুয়ালি বলার একটি নতুন পৃষ্ঠা ভিউ হিসাবে একটি ইউআরএল লগ করার উপায় আছে।

_gaq.push(['_trackPageview', '<url>']); কাজটি করবে, তবে অ্যাঙ্গুলারজেএসের সাথে কীভাবে তা বাঁধবে?

এখানে একটি পরিষেবা যা আপনি ব্যবহার করতে পারেন:

(function(angular) { 

  angular.module('analytics', ['ng']).service('analytics', [
    '$rootScope', '$window', '$location', function($rootScope, $window, $location) {
      var track = function() {
        $window._gaq.push(['_trackPageview', $location.path()]);
      };
      $rootScope.$on('$viewContentLoaded', track);
    }
  ]);

}(window.angular));

আপনি যখন নিজের কৌণিক মডিউলটি সংজ্ঞায়িত করেন, বিশ্লেষণ মডিউলটি এর মতো অন্তর্ভুক্ত করুন:

angular.module('myappname', ['analytics']);

আপডেট :

আপনার সাথে নতুন ইউনিভার্সাল গুগল অ্যানালিটিক্স ট্র্যাকিং কোডটি ব্যবহার করা উচিত:

$window.ga('send', 'pageview', {page: $location.url()});

6
এখানে অন্য লক্ষণীয় বিষয়টি হ'ল আপনার "বিশ্লেষণ" পরিষেবাটি কোথাও অন্তর্ভুক্ত করা দরকার। আমি আমার কাজ করেছি।
নিক্স

প্রতিটি মডিউল, বা কেবলমাত্র প্রাথমিক অ্যাপ্লিকেশন সহ এটির কী দরকার?
ডিজাইনারমনকি

2
@ ডিজাইনারমনকি আপনি যদি কেবলমাত্র আপনার মূল অ্যাপ্লিকেশন মডিউলে অন্তর্ভুক্ত থাকেন তবে এটি কাজ করা উচিত। আপনার যদি সম্পূর্ণরূপে স্বাধীন মডিউল থাকে তবে এর জন্য আপনার প্রধান মডিউলটির প্রয়োজন হয় না, আপনাকে আবার এটি অন্তর্ভুক্ত করতে হতে পারে। চিয়ার্স!
হারালান ডবরেভ

আপনি যদি কোনও পরিষেবা ব্যবহার করছেন তবে আপনার "এই" কীওয়ার্ড: উত্স দিয়ে আপনার ফাংশনগুলি সংজ্ঞায়িত করা উচিত । উদাহরণস্বরূপ, পরিষেবার মধ্যে এটি হবে this.track = function($window.ga('send', 'pageview', {page: $location.url()});এটি আপনাকে googleAnalytics.track();আপনার অ্যাপ.আরুন () ফাংশনের মধ্যে ব্যবহার করতে দেয়
জ্যাকুন

48
app.run(function ($rootScope, $location) {
    $rootScope.$on('$routeChangeSuccess', function(){
        ga('send', 'pageview', $location.path());
    });
});

8
দ্রষ্টব্য: আপনি যদি সংক্ষিপ্তকরণ / সংকলন ব্যবহার করেন তবে আপনাকে প্যারামিটারের নামগুলি উল্লেখ করতে হবে:app.run(["$rootScope", "$location", function(...
dplass

আপনি যদি প্রতিটি কন্ট্রোলারে জিএ কোড অন্তর্ভুক্ত না করতে চান তবে এই সমাধানটি দুর্দান্ত।
হাওয়া

1
আপনার কাছে যদি অ্যাসিঙ্ক কোড থাকে যা আপনার শিরোনামকে পরিবর্তনশীল করে, অন্যথায় এটি দুর্দান্ত।
জোহান

40

মাত্র একটি দ্রুত সংযোজন। আপনি যদি নতুন অ্যানালিটিক্স.জে ব্যবহার করেন, তবে:

var track = function() {     
 ga('send', 'pageview', {'page': $location.path()});                
};

অতিরিক্তভাবে একটি পরামর্শ হ'ল গুগল বিশ্লেষণগুলি লোকালহোস্টে চালিত হবে না। সুতরাং আপনি যদি লোকালহোস্টে পরীক্ষা করে নিচ্ছেন তবে ডিফল্ট তৈরি ( সম্পূর্ণ ডকুমেন্টেশন ) এর পরিবর্তে নিম্নলিখিতটি ব্যবহার করুন

ga('create', 'UA-XXXX-Y', {'cookieDomain': 'none'});

ওহ মানুষ, ধন্যবাদ আমি অদ্ভুত ত্রুটিগুলি পেয়েছিলাম, এবং লক্ষ্য করেছি যে আমার স্নিপেটটিতে এমনকি _গাক নেই, হেই। বোকা গুগল: তাদের কোড আপডেট করে এবং এগুলি কি! হা হা।
সিডব্লিউস্পিয়ার

3
নিশ্চিত হয়ে নিন যে আপনি $windowউইন্ডোটি অ্যাক্সেস করতে ব্যবহার করেছেন ( gaএকা কৌণিকের মধ্যেই সম্ভবত খুব সম্ভবত undefined)। এছাড়াও, আপনি ga('send', 'pageview');যখন কোনও পৃষ্ঠায় প্রথম অবতরণ করবেন তখন ডুপ্লিকেটগুলি রোধ করতে আপনি আপনার আসল জিএ কোড থেকে সরিয়ে নিতে পারেন ।
সিডব্লিউস্পিয়ার

6
ইউআই-রাউটার ব্যবহার করে আপনি পৃষ্ঠার মতামত পাঠাতে পারেন:$rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) { ga('send', 'pageview', { 'page': $location.path(), 'title': toState.name }); });
ফেরিস

2
যোগ করতে: আপনি যদি নিজের অ্যাপ্লিকেশনটিতে অনুসন্ধানের পরামিতিগুলি ব্যবহার করে থাকেন তবে আপনি তাদের ব্যবহার করতে পারেন$location.url()
অ্যাড

2
.Url () এর চেয়ে .path () ব্যবহার করা ভাল বলে এই উত্তরটি আমি উন্নত করেছি কারণ আপনি সাধারণত ক্যোয়ারিং স্ট্রিং প্যারামগুলি বাদ দিতে চান। দেখুন: গুগল অ্যানালিটিক্স কনফিগারেশন
ত্রুটি

11

আমি একটি পরিষেবা + ফিল্টার তৈরি করেছি যা আপনাকে এইগুলিতে সহায়তা করতে পারে এবং আপনি যদি ভবিষ্যতে যুক্ত করতে চান তবে অন্য কোনও সরবরাহকারীর সাথেও থাকতে পারে।

পরীক্ষা করে দেখুন https://github.com/mgonto/angularytics এবং আমাকে কিভাবে এই আপনার জন্য কাজ করা যাক।


10

আমার কাছে ওয়াইন্নু এবং ডিপিন্ডা দ্বারা উত্তরগুলি মার্জ করা ছিল।

angular.module('app', [])
  .run(['$rootScope', '$location', '$window',
    function($rootScope, $location, $window) {
      $rootScope.$on('$routeChangeSuccess',
        function(event) {
          if (!$window.ga) {
            return;
          }
          $window.ga('send', 'pageview', {
            page: $location.path()
          });
        });
    }
  ]);

তৃতীয় প্যারামিটারটিকে অবজেক্ট হিসাবে সেট করা (কেবলমাত্র $ লোকেশন.পাথ () এর পরিবর্তে) এবং $ stateChangeSuccess এর পরিবর্তে $ রুটচেনজস্যাক্সেস ব্যবহার করে কৌতুকটি করেছে।

আশাকরি এটা সাহায্য করবে.


7

উপরের পদ্ধতির সাহায্যে আমি গিথুব এ একটি সাধারণ উদাহরণ তৈরি করেছি।

https://github.com/isamuelson/angularjs-googleanalytics


আমি পথটি আরও ভালভাবে প্রতিবেদন করার জন্য একটি সংশোধন করেছি। সুতরাং এখন যদি আপনার /account/:accountId ওরফে পথের রুটটি থাকে তবে http://somesite.com/account/123এটি এখন সেই পথটির মতোই রিপোর্ট করবে/account?accountId=123
আইবুটস্ট্র্যাপ

@ আইবুটস্ট্র্যাপ কিউইট স্ট্রিংয়ে রুট প্যারামগুলি রেখে কী লাভ?
পাভেল নিকোলভ

@ আইবুটস্ট্র্যাপ আমার একই প্রশ্ন রয়েছে, রুট প্যারামগুলিকে ক্যোয়ারী স্ট্রিংয়ে রেখে কী লাভ?
জাজুন নুগেইন

1
সমস্ত রুট পৃথক পৃষ্ঠা নয় এবং জিএ প্রতিটি রুটকে আলাদা পৃষ্ঠা হিসাবে বিবেচনা করে। রুটটিকে ক্যোয়ারী স্ট্রিংয়ে রূপান্তর করে আপনার কাছে ক্যোরি স্ট্রিংয়ের কিছু অংশ উপেক্ষা করার বিকল্প রয়েছে।
আইবুটস্ট্র্যাপ

5

এটি করার সর্বোত্তম উপায় হ'ল ইতিহাস শ্রোতার উপর ভিত্তি করে গুগল অ্যানালিটিক্স ট্যাগগুলিকে ফায়ার করতে গুগল ট্যাগ ম্যানেজার ব্যবহার করা। এগুলি জিটিএম ইন্টারফেসে অন্তর্নির্মিত এবং সহজেই ক্লায়েন্টের পক্ষের HTML5 ইন্টারঅ্যাকশনগুলিতে ট্র্যাকিংয়ের অনুমতি দেয় allow

ইতিহাসে অন্তর্নির্মিত ভেরিয়েবলগুলি সক্ষম করুন এবং ইতিহাসের পরিবর্তনের উপর ভিত্তি করে কোনও ইভেন্ট ফায়ার করার জন্য একটি ট্রিগার তৈরি করুন।


5

আপনার মধ্যে index.html, গা স্নিপেটটি অনুলিপি করুন এবং আটকান তবে লাইনটি সরিয়ে দিনga('send', 'pageview');

<!-- Google Analytics: change UA-XXXXX-X to be your site's ID -->
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  ga('create', 'UA-XXXXXXXX-X');
</script>

আমি এটি নিজের my-google-analytics.jsইঞ্জেকশন সহ এটি নিজস্ব কারখানার ফাইল দিতে চাই :

angular.module('myApp')
  .factory('myGoogleAnalytics', [
    '$rootScope', '$window', '$location', 
    function ($rootScope, $window, $location) {

      var myGoogleAnalytics = {};

      /**
       * Set the page to the current location path
       * and then send a pageview to log path change.
       */
      myGoogleAnalytics.sendPageview = function() {
        if ($window.ga) {
          $window.ga('set', 'page', $location.path());
          $window.ga('send', 'pageview');
        }
      }

      // subscribe to events
      $rootScope.$on('$viewContentLoaded', myGoogleAnalytics.sendPageview);

      return myGoogleAnalytics;
    }
  ])
  .run([
    'myGoogleAnalytics', 
    function(myGoogleAnalytics) {
        // inject self
    }
  ]);

আমি সেই স্বয়ক্ষণের জিনিস পছন্দ করি :) আপ
স্যাম ভ্লোবার্গস

কৌতূহলের বাইরে, আপনি কেন pageবর্তমান পথটি সেট করলেন এবং তারপরে এটি জমা দেবেন pageview? ন্যায়বিচারের পরিবর্তে সেভাবে করার পার্থক্য কী $window.ga('send', 'pageview', {page: $location.url()});?
ফিজিক্স

1
আমি টিবিএইচ স্মরণ করতে পারি না তবে এটি দেখে আমি বলব যে এটি অন্যান্য ক্রিয়াকলাপের জন্য বা অন্য কোথাও অতিরিক্ত জিনিস লগ করার জন্য নমনীয়তা ফেলেছে এবং বর্তমান পৃষ্ঠার জিএ স্পষ্ট করে বলতে গেলে আরও নির্ভুল হতে পারে, তাই গা এর চেয়ে সঠিকভাবে ক্রিয়া চালিয়ে যেতে পারে কিছু "স্বেচ্ছাসেবী" পৃষ্ঠা url এর জন্য একটি পৃষ্ঠা দর্শন লগইন করা উচিত।
ilovett

আপনি যদি রিয়েলটাইম বিশ্লেষণগুলি গুগলে কাজ করতে চান তবে আপনার "সেট" করা উচিত। ডকুমেন্টেশন রেফারেন্সের জন্য কেন: ডেভেলপারগুলি.
com

'সেট' সুপারিশ করা হয় যাতে প্রতিটি পৃষ্ঠাগুলি একই পৃষ্ঠায় প্রেরণ করা হয় (ব্যবহারকারীর ইন্টারঅ্যাকশনগুলি ট্র্যাক করতে জিএ ইভেন্টের মতো) একই পৃষ্ঠাগুলির মান সহ প্রেরণ করা হয়। রিয়েলটাইম বিশ্লেষণগুলির সাথে কিছুই করার নেই। ডেভেলপারস
google.com/analytics/devguides/collection/…

5

আমি gtag()ফাংশনটির পরিবর্তে ফাংশনটি কাজ করেছি ga()

এই <head>বিভাগের মধ্যে সূচক। Html ফাইলে :

<script async src="https://www.googletagmanager.com/gtag/js?id=TrackingId"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'TrackingId');
</script>

অ্যাঙ্গুলারজেএস কোডে:

app.run(function ($rootScope, $location) {
  $rootScope.$on('$routeChangeSuccess', function() {
    gtag('config', 'TrackingId', {'page_path': $location.path()});
  });
});

TrackingIdআপনার নিজের ট্র্যাকিং আইডির সাথে প্রতিস্থাপন করুন ।


4

যদি কেউ নির্দেশ ব্যবহার করে বাস্তবায়ন করতে চান তবে সূচক html এ একটি ডিভ সনাক্ত করুন (কেবল বডি ট্যাগের নিচে বা একই ডিওএম স্তরে)

<div class="google-analytics"/>

এবং তারপরে নির্দেশিকায় নিম্নলিখিত কোড যুক্ত করুন

myApp.directive('googleAnalytics', function ( $location, $window ) {
  return {
    scope: true,
    link: function (scope) {
      scope.$on( '$routeChangeSuccess', function () {
        $window._gaq.push(['_trackPageview', $location.path()]);
      });
    }
  };
});

3

আপনি যদি ইউআই-রাউটার ব্যবহার করছেন তবে আপনি এই জাতীয় han stateChangeSuccess ইভেন্টে সাবস্ক্রাইব করতে পারেন:

$rootScope.$on('$stateChangeSuccess', function (event) {
    $window.ga('send', 'pageview', $location.path());
});

একটি সম্পূর্ণ কাজের উদাহরণের জন্য এই ব্লগ পোস্ট দেখুন


3

গুগল রিয়েলটাইম বিশ্লেষণের জন্য রুটগুলি নেওয়া হয়েছে তা নিশ্চিত করতে GA 'সেট' ব্যবহার করুন। অন্যথায় পরবর্তী সময়ে জিএ-তে কলগুলি রিয়েলটাইম প্যানেলে প্রদর্শিত হবে না।

$scope.$on('$routeChangeSuccess', function() {
    $window.ga('set', 'page', $location.url());
    $window.ga('send', 'pageview');
});

গুগল 'প্রেরণ' এ তৃতীয় পরম পাস করার পরিবর্তে এই পদ্ধতির দৃ strongly়ভাবে পরামর্শ দেয়। https://developers.google.com/analytics/devguides/collection/analyticsjs/single-page-applications


3

আপনারা যারা এনজিআরউটের পরিবর্তে অ্যাংুলার ইউআই রাউটার ব্যবহার করছেন তাদের জন্য পৃষ্ঠা ভিউ ট্র্যাক করতে নিম্নলিখিত কোডটি ব্যবহার করতে পারেন।

app.run(function ($rootScope) {
    $rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {
        ga('set', 'page', toState.url);
        ga('send', 'pageview');
    });
});

3

সিঙ্গল পেজ অ্যাপ্লিকেশন তৈরি করা বিকাশকারীরা অটোট্র্যাক ব্যবহার করতে পারেন , এতে একটি urlChangeTracker প্লাগইন রয়েছে যা আপনার জন্য এই গাইডের তালিকাভুক্ত সমস্ত গুরুত্বপূর্ণ বিবেচনা পরিচালনা করে। ব্যবহার এবং ইনস্টলেশন নির্দেশের জন্য অটোট্র্যাক ডকুমেন্টেশন দেখুন ।


3

আমি এইচটিএমএল 5 মোডে অ্যাংলুয়ারজেএস ব্যবহার করছি। আমি নিম্নলিখিত সমাধানটি সবচেয়ে নির্ভরযোগ্য হিসাবে খুঁজে পেয়েছি:

কৌনিক-গুগল-অ্যানালিটিক্স লাইব্রেরি ব্যবহার করুন । এর মতো কিছু দিয়ে এটি সূচনা করুন:

//Do this in module that is always initialized on your webapp    
angular.module('core').config(["AnalyticsProvider",
  function (AnalyticsProvider) {
    AnalyticsProvider.setAccount(YOUR_GOOGLE_ANALYTICS_TRACKING_CODE);

    //Ignoring first page load because of HTML5 route mode to ensure that page view is called only when you explicitly call for pageview event
    AnalyticsProvider.ignoreFirstPageLoad(true);
  }
]);

এর পরে, $ stateChangeSuccess 'এ শ্রোতা যুক্ত করুন এবং ট্র্যাকপেজ ইভেন্টটি প্রেরণ করুন।

angular.module('core').run(['$rootScope', '$location', 'Analytics', 
    function($rootScope, $location, Analytics) {
        $rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams, options) {
            try {
                Analytics.trackPage($location.url());
            }
            catch(err) {
              //user browser is disabling tracking
            }
        });
    }
]);

যে কোনও মুহুর্তে, আপনি যখন নিজের ব্যবহারকারীকে উদ্বেগিত করবেন তখন আপনি সেখানে অ্যানালিটিকাগুলি ইনজেক্ট করতে পারবেন এবং কল করতে পারেন:

Analytics.set('&uid', user.id);

2

আমি ইউআই-রাউটার ব্যবহার করছি এবং আমার কোডটি দেখতে এমন দেখাচ্ছে:

$rootScope.$on('$stateChangeSuccess', function(event, toState, toParams){
  /* Google analytics */
  var path = toState.url;
  for(var i in toParams){
    path = path.replace(':' + i, toParams[i]);
  }
  /* global ga */
  ga('send', 'pageview', path);
});

এইভাবে আমি বিভিন্ন রাজ্য ট্র্যাক করতে পারি। হয়তো কেউ এটি দরকারী ব্যবহারযোগ্য পাবেন।


1

আমি ব্যক্তিগতভাবে বর্তমান পথের পরিবর্তে টেম্পলেট URL সহ আমার বিশ্লেষণগুলি সেট আপ করতে চাই। এই প্রধানত কারণ আমার আবেদন যেমন অনেক কাস্টম পাথ আছে message/:idবা profile/:id। যদি আমি এই পাথগুলি প্রেরণ করতাম তবে বিশ্লেষণের মধ্যে আমার এতগুলি পৃষ্ঠাগুলি দেখা হচ্ছিল, কোন পৃষ্ঠা ব্যবহারকারীরা সবচেয়ে বেশি পরিদর্শন করছেন তা পরীক্ষা করা খুব কঠিন difficult

$rootScope.$on('$viewContentLoaded', function(event) {
    $window.ga('send', 'pageview', {
        page: $route.current.templateUrl.replace("views", "")
    });
});

আমি এখন যেমন আমার বিশ্লেষণ মধ্যে পরিষ্কার পৃষ্ঠা দৃশ্য পেতে user-profile.htmlএবং message.htmlহচ্ছে অনেক পেজের পরিবর্তে profile/1, profile/2এবংprofile/3 । আমি এখন কত লোক ব্যবহারকারীর প্রোফাইল দেখছি তা দেখতে রিপোর্টগুলি প্রক্রিয়া করতে পারি।

বিশ্লেষকগুলির মধ্যে কেন এটি খারাপ অভ্যাস বলে কারও যদি আপত্তি থাকে তবে আমি এটি সম্পর্কে শুনে খুশি হতে পারব। গুগল অ্যানালিটিক্স ব্যবহারে বেশ নতুন, তাই এটি নিশ্চিত না যে এটি সেরা পদ্ধতির বা না।


1

আমি সেগমেন্ট বিশ্লেষণ গ্রন্থাগারটি ব্যবহার করার এবং আমাদের কৌণিক কুইকস্টার্ট গাইড অনুসরণ করার পরামর্শ দিচ্ছি । আপনি একক এপিআই দিয়ে পৃষ্ঠা ভিজিট এবং ব্যবহারকারী আচরণ ক্রিয়াকে ট্র্যাক করতে সক্ষম হবেন। আপনার যদি এসপিএ থাকে, RouterOutletপৃষ্ঠাটি যখন রেন্ডার হয় এবং কল আহ্বান ngOnInitকরতে ব্যবহার করেন আপনি সেই উপাদানটি পরিচালনা করতে পারবেন page। নীচের উদাহরণে আপনি এটি করতে পারার এক উপায় দেখায়:

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
  ngOnInit() {
    window.analytics.page('Home');
  }
}

আমি https://github.com/segmentio/analytics-angular এর রক্ষণাবেক্ষণকারী । বিভাগের সাথে, আপনি কোনও অতিরিক্ত কোড না লিখে একাধিক বিশ্লেষণ সরঞ্জাম (আমরা 250+ এরও বেশি গন্তব্য সমর্থন করি) চেষ্টা করতে আগ্রহী যদি আপনি একটি স্যুইচ ফ্লিপ দ্বারা অন-অফ-অফ করে বিভিন্ন গন্তব্য স্যুইচ করতে সক্ষম হবেন। 🙂


0

পেড্রো লোপেজের উত্তরের সাথে আরও একত্রীকরণ,

আমি এটিকে আমার এনজিওগ্রাণালিটিস মডিউলে যুক্ত করেছি (যা আমি অনেক অ্যাপে পুনরায় ব্যবহার করি):

var base = $('base').attr('href').replace(/\/$/, "");

এই ক্ষেত্রে, আমার আমার সূচী লিঙ্কটিতে একটি ট্যাগ রয়েছে:

  <base href="/store/">

এঙ্গুলার.জেএস ভি 1.3-তে এইচটিএমএল 5 মোড ব্যবহার করার সময় এটি কার্যকর

(যদি আপনার বেস ট্যাগটি স্ল্যাশ / দিয়ে শেষ না করে তবে প্রতিস্থাপন () ফাংশন কলটি সরিয়ে ফেলুন /)

angular.module("ngGoogleAnalytics", []).run(['$rootScope', '$location', '$window',
    function($rootScope, $location, $window) {
      $rootScope.$on('$routeChangeSuccess',
        function(event) {
          if (!$window.ga) { return; }
          var base = $('base').attr('href').replace(/\/$/, "");

          $window.ga('send', 'pageview', {
            page: base + $location.path()
          });
        }
      );
    }
  ]);

-3

আপনি যদি গুগল অ্যানালিটিক্সের নতুন ট্র্যাকিং কোডের পুরো নিয়ন্ত্রণের সন্ধান করে থাকেন তবে আপনি আমার খুব নিজস্ব অ্যাংুলার-জিএ ব্যবহার করতে পারেন ।

এটি gaইঞ্জেকশনের মাধ্যমে উপলব্ধ করে তোলে তাই এটি পরীক্ষা করা সহজ। এটি প্রতিটি রুট চেঞ্জে পথ নির্ধারণ করা ছাড়া কোনও যাদু করে না। আপনার এখনও পৃষ্ঠা মতামত এখানে পাঠাতে হবে।

app.run(function ($rootScope, $location, ga) {
    $rootScope.$on('$routeChangeSuccess', function(){
        ga('send', 'pageview');
    });
});

সংযোজনীর একটি নির্দেশ রয়েছে gaযা একাধিক বিশ্লেষণ ফাংশনগুলিকে ইভেন্টগুলিতে আবদ্ধ করতে দেয়:

<a href="#" ga="[['set', 'metric1', 10], ['send', 'event', 'player', 'play', video.id]]"></a>
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.